0

我试图让我的头脑围绕 AngularJS 中的 Promises 概念。

以下代码是否在正确的轨道上?有人可以解释这个PlateCheckService.checkPlate方法吗?如果我不返回承诺,为什么?为什么带有andreturn $http.post().then的对象的内部返回不起作用?我认为这是一个连锁/内在的承诺?messagealertClass

/// <reference path="angular.js" />
(function () {
"use strict"

var app = angular.module('cs');

app.service('PlateCheckService', ['$http', function ($http) {
    return {
        checkPlate: function (plateNumber) {
            return $http.post('PlateCheck/Index', {
                plateNumber: plateNumber
            }).then(function (response) {
                return {
                    message: response.data.VehicleAtl === null ? 'Clean' : 'Hot',
                    alertClass: response.data.VehicleAtl === null ? 'alert-success' : 'alert-danger'
                }
            });
        }
    }
}]);

app.controller('PlateCheckCtrl', ['$scope', 'PlateCheckService', function ($scope, PlateCheckService) {
    var plateCheck = {
        plateNumber: '',
        message: '',
        alertClass: '',
        checkPlate: function (plateNumber) {
            var _this = this;

            PlateCheckService.checkPlate(plateNumber).then(function (response) {
                _this.message = response.message;
                _this.alertClass = response.alertClass;
            });
        }
    };

    $scope.plateCheck = plateCheck;
}]);

}());
4

1 回答 1

1

是的,这是因为链式承诺。请记住,调用 tothen将在调用它所包含的函数之前返回一个 Promise。

所以,你在这里的电话:PlateCheckService.checkPlate(plateNumber)将期望返回一个链式承诺。但是,您的服务的then封闭函数没有返回承诺。then因此,一旦解决,它将无法具有链接功能。

您可以使用以下伪代码将其可视化:

$http.get('url')
    .then(function(response) {
        return aPromise;
    })
    .then(function(aPromiseResponse) {
        return bPromise;
    })
    .then(function(bPromiseResponse) {
        return cPromise;
    })
    .then(function(cPromiseResponse) {
        // when scope is available
        $scope.bindToMe = cPromiseResponse.value;
    });

如果您想向服务中的 Promise 链添加功能,则包装后的 Promise 函数也需要返回一个 Promise。

我发现最简单的方法是使用$q.when. $q.when如果对象不是 Promise,则将对象包装在 Promise 中。如果一个对象已经可用(如您的情况),那么$q.when将立即解决。文档$q.when这里

因此,您应该能够通过在服务中使用它来使您的代码正常工作:

return $q.when({
          message: response.data.VehicleAtl === null ? 'Clean' : 'Hot',
          alertClass: response.data.VehicleAtl === null ? 'alert-success' : 'alert-danger'
       });
于 2013-10-27T22:06:05.300 回答