AngularJS $qProvider

AngularJS is a JavaScript-based framework. It can be used by adding it to an HTML page using a <script> tag. AngularJS helps in extending the HTML attributes with the help of directives and binding of data to the HTML with expressions.

In this article, we'll learn about the AngularJS $qProvider. The $qProvider is a provider that allows you to configure the behavior of the $q service, which is the AngularJS implementation of promises. The $qProvider provides methods to control and customize the default settings of promises.

Method used:

• errorOnUnhandledRejections(): It is used to retrieve or override whether to generate an error when a rejected promise is not handled. This feature is enabled by default.

Return value: It returns the boolean value for the current value, while without invoking the new value, otherwise forms chaining for self.

Approach 1: Promise Creation and Handling

Syntax:

app.config(function ($qProvider) {
 $qProvider.errorOnUnhandledRejections(false);
});

Example: In this example, we have configured the $qProvider to disable the generation of errors when a rejected promise is not handled using the errorOnUnhandledRejections(false) method in the app.config() function. By setting this option, AngularJS won't throw an error when a promise rejection is not explicitly handled.

Output:

👁 ezgifcom-crop-(23).gif

Approach 2: Using $qProvider.errorOnUnhandledRejections() method

Syntax:

app.controller("PromiseController", function ($scope, $q) {
 $scope.mydata = "";
 $scope.dataLoad = function () {
 var deferred = $q.defer();
 setTimeout(function () {
 deferred.resolve("The data has been loaded!");
 $scope.$apply();
 }, 1000);
 deferred.promise.then(function (response) {
 $scope.mydata = response;
 });
 };
});

Example: In this example, we have used a controller PromiseController that uses the $q service to create a promise. Here, inside the dataLoad() function, we have used the setTimeout() to simulate an asynchronous operation that resolves the promise after 1 second. The resolved data is then assigned to the $scope.mydata variable using the then() method.

Output:

👁 ezgifcom-crop-(22).gif

Reference: https://docs.angularjs.org/api/ng/provider/$qProvider