Course Progress 81%

AngularJS Promises – $q

← AngularJS Digest Cycle AngularJS Custom Filters →

AngularJS में asynchronous operations (जैसे AJAX calls, timeout, background tasks) को handle करने के लिए Promises का उपयोग किया जाता है। AngularJS में promises को manage करने के लिए $q service दी गई है।
$q asynchronous code को clean, readable और manageable बनाती है।

इस chapter में आप समझेंगे:

  • Promise क्या होता है
  • $q service कैसे काम करती है
  • then, catch, finally
  • Real-world examples और best practices

Promise क्या है

Promise एक object होता है जो future में मिलने वाले result को represent करता है।

Promise की तीन states होती हैं:

  • Pending – अभी result नहीं आया
  • Resolved (Fulfilled) – operation successful
  • Rejected – operation failed

AngularJS $q इन्हीं states को manage करता है।

Promise क्यों जरूरी है

Without promise:

  • Nested callbacks (callback hell)
  • Code difficult to read
  • Error handling messy

With promise:

  • Clean chaining
  • Centralized error handling
  • Better async flow control

$q Service क्या है

$q AngularJS की built-in service है जो promise-based programming को support करती है।

Main features:

  • Promise create करना
  • Resolve / reject handle करना
  • Multiple async operations manage करना

$q को Inject करना

app.controller("myCtrl", function($scope, $q) {
});

Explanation

  • $q dependency injection से controller या service में आती है
  • Promise logic AngularJS digest cycle से integrated रहती है

Creating a Promise using $q.defer()

app.service("dataService", function($q) {
  this.getData = function() {
    var deferred = $q.defer();

    setTimeout(function() {
      deferred.resolve("Data Loaded");
    }, 1000);

    return deferred.promise;
  };
});

Code Explanation

  • $q.defer() deferred object create करता है
  • deferred.resolve() success state set करता है
  • deferred.promise consumer को return किया जाता है

Consuming Promise using then()

app.controller("ctrl", function($scope, dataService) {
  dataService.getData().then(function(result) {
    $scope.message = result;
  });
});

Explanation

  • then() resolved value receive करता है
  • UI automatically update होती है

Handling Errors using reject()

deferred.reject("Error occurred");

dataService.getData().then(
  function(success) {
  },
  function(error) {
    $scope.error = error;
  }
);

Explanation

  • reject() failure state represent करता है
  • Error handling clean और centralized रहती है

Using catch()

dataService.getData()
  .then(function(result) {
    $scope.data = result;
  })
  .catch(function(err) {
    $scope.error = err;
  });

Explanation

  • catch() error handling के लिए better syntax है
  • Chained promises में useful

finally() Method

dataService.getData()
  .finally(function() {
    $scope.loading = false;
  });

Explanation

  • Success या error दोनों case में execute होता है
  • Loader hide करने के लिए useful

$q.resolve() and $q.reject()

return $q.resolve("Immediate Success");

return $q.reject("Immediate Error");

Explanation

  • Already available data को promise में wrap करता है
  • Conditional logic में useful

$q.all() – Multiple Promises

$q.all([promise1, promise2]).then(function(results) {
  $scope.data1 = results[0];
  $scope.data2 = results[1];
});

Explanation

  • Multiple async calls parallel में execute होती हैं
  • सब successful हों तभी then() call होता है

$q.when()

$q.when(value).then(function(result) {
});

Explanation

  • Value promise हो या normal value, दोनों handle करता है
  • Consistent promise-based code के लिए useful

$http और $q Relation

AngularJS $http internally $q use करता है।

$http.get("data.json").then(function(response) {
  $scope.data = response.data;
});

Explanation

  • $http already promise return करता है
  • Extra $q.defer() की जरूरत नहीं होती

Promise Chaining Example

dataService.getData()
  .then(function(data) {
    return processData(data);
  })
  .then(function(finalData) {
    $scope.result = finalData;
  });

Explanation

  • Sequential async flow बनता है
  • Code readable और maintainable रहता है

Common Promise Mistakes

  • Unnecessary $q.defer() use करना
  • Promise return न करना
  • Errors handle न करना
  • Digest cycle के बाहर promises resolve करना

Best Practices

  • $http promises directly use करें
  • Services में promise logic रखें
  • Controllers clean रखें
  • then chaining prefer करें

Summary

इस chapter में आपने सीखा:

  • Promise क्या है
  • AngularJS $q service
  • Promise create और consume करना
  • Error handling (catch)
  • Multiple promises ($q.all)
  • Best practices और common mistakes
← AngularJS Digest Cycle AngularJS Custom Filters →
  • Home