javascript - angularjs wait for promise example




Wie kann ich ein gelöstes Versprechen von einem AngularJS-Service mit $ q zurückgeben? (5)

Mein Service ist:

myApp.service('userService', [
  '$http', '$q', '$rootScope', '$location', function($http, $q, $rootScope, $location) {
    var deferred;
    deferred = $q.defer();
    this.initialized = deferred.promise;
    this.user = {
      access: false
    };
    this.isAuthenticated = function() {
      this.user = {
        first_name: 'First',
        last_name: 'Last',
        email: '[email protected]',
        access: 'institution'
      };
      return deferred.resolve();
    };
  }
]);

Ich rufe das in meiner config über:

myApp.run([
  '$rootScope', 'userService', function($rootScope, userService) {
    return userService.isAuthenticated().then(function(response) {
      if (response.data.user) {
        return $rootScope.$broadcast('login', response.data);
      } else {
        return userService.logout();
      }
    });
  }
]);

Es klagt jedoch, dass es then keine Funktion ist. Bekomme ich das gelöste Versprechen nicht zurück?

https://code.i-harness.com


So geben Sie einfach ein vorab aufgelöstes Versprechen in Angular zurück

Gelöstes Versprechen:

return $q.when( someValue );    // angular 1.2+
return $q.resolve( someValue ); // angular 1.4+, alias to `when` to match ES6

Abgelehntes Versprechen:

return $q.reject( someValue );

Für kürzeren JavaScript-Code verwenden Sie diesen:

myApp.service('userService', [
  '$q', function($q) {
    this.initialized = $q.when();
    this.user = {
      access: false
    };
    this.isAuthenticated = function() {
      this.user = {
        first_name: 'First',
        last_name: 'Last',
        email: '[email protected]',
        access: 'institution'
      };
      return this.initialized;
    };
  }
]);

Sie wissen, dass Sie die Bindung an userService.user verlieren, indem Sie sie mit einem neuen Objekt überschreiben, anstatt nur die Objekteigenschaften festzulegen.

Ich meine hier ein Beispiel für meinen plnkr.co-Beispielcode (Arbeitsbeispiel: http://plnkr.co/edit/zXVcmRKT1TmiBCDL4GsC?p=preview ):

angular.module('myApp', []).service('userService', [
    '$http', '$q', '$rootScope', '$location', function ($http, $q, $rootScope, $location) {
    this.initialized = $q.when(null);
    this.user = {
        access: false
    };
    this.isAuthenticated = function () {
        this.user.first_name = 'First';
        this.user.last_name = 'Last';
        this.user.email = '[email protected]';
        this.user.access = 'institution';
        return this.initialized;
    };
}]);

angular.module('myApp').controller('myCtrl', ['$scope', 'userService', function ($scope, userService) {
    $scope.user = userService.user;
    $scope.callUserService = function () {
        userService.isAuthenticated().then(function () {
            $scope.thencalled = true;
        });
    };
}]);

Hier ist der richtige Code für Ihren Service:

myApp.service('userService', [
  '$http', '$q', '$rootScope', '$location', function($http, $q, $rootScope, $location) {

    var user = {
      access: false
    };

    var me = this;

    this.initialized = false;
    this.isAuthenticated = function() {

      var deferred = $q.defer();
      user = {
        first_name: 'First',
        last_name: 'Last',
        email: '[email protected]',
        access: 'institution'
      };
      deferred.resolve(user);
      me.initialized = true;

      return deferred.promise;
    };
  }
]);

Dann sollte sich Ihr Controller entsprechend ausrichten:

myApp.run([
  '$rootScope', 'userService', function($rootScope, userService) {
    return userService.isAuthenticated().then(function(user) {
      if (user) {
        // You have access to the object you passed in the service, not to the response.
        // You should either put response.data on the user or use a different property.
        return $rootScope.$broadcast('login', user.email);  
      } else {
        return userService.logout();
      }
    });
  }
]);

Einige Punkte zum Service:

  • Stellen Sie in einem Dienst nur das dar, was angezeigt werden muss. Der Benutzer sollte intern aufbewahrt werden und darf nur von Getigern abgerufen werden.

  • Wenn Sie sich in Funktionen befinden, verwenden Sie 'me', den Dienst, um Randfälle davon mit Javascript zu vermeiden.

  • Ich ahnte, was initialisiert werden sollte, fühle mich frei, mich zu korrigieren, wenn ich falsch geraten habe.


Um ein gelöstes Versprechen zurückzugeben, können Sie Folgendes verwenden:

return $q.defer().resolve();

Wenn Sie etwas auflösen oder Daten zurückgeben müssen:

return $q.defer().resolve(function(){

    var data;
    return data;

});

Von Ihrer Servicemethode:

function serviceMethod() {
    return $timeout(function() {
        return {
            property: 'value'
        };
    }, 1000);
}

Und in deinem Controller:

serviceName
    .serviceMethod()
    .then(function(data){
        //handle the success condition here
        var x = data.property
    });






angular-promise