javascript - 无法读取 Angular JS 中未定义错误的属性

Question

这是我的 angularJS 服务和 Controller 。

sampleApp.factory('BrandService', function($http, $q) {

    var BrandService =  {};
    var BrandList = [];

    BrandService.GetBrands = function() {
        var Info = {};
        Info.Action = "GET";
        Info = JSON.stringify (Info);

        var req = {
            url: BrandURL,
            method: 'POST',
            headers: { 'Content-Type': 'application/json'},
            data: Info
        };  
        if ( BrandList.length == 0 )
        {
            $http(req)
            .success(function(response) {
                BrandList = response.data
                alert ('Brand Fetching is successful');
                return response.data;
            })  
            .error(function (data, status, headers, config) {
                alert ('Brand Fetching Error');
                alert (status);
                alert (data);
            });
        }
        else
        {
           var deferred = $q.defer();
           deferred.resolve(BrandList);
           return deferred.promise;
        }
    }

    return BrandService;
});


sampleApp.controller('BrandController', ['$scope', 'BrandService', function ($scope, BrandService){

    $scope.Brands = [];

    $scope.GetBrands = function() {
        BrandService.GetBrands().then(function(data) {
            $scope.Brands = data;
        });
    };

    $scope.GetBrands();

}]);

当 Controller 加载时，我看到以下错误。

无法读取未定义的属性“then” 在 l.$scope.GetBrands (Controllers.js:337)

有人可以帮我解决我做错的事情吗？

Answer 1

当数据尚未缓存时，您不会在 HTTP 请求的情况下返回 promise 。

正确的代码是:

sampleApp.factory('BrandService', function($http, $q) {

    var BrandService = {};
    var BrandList = [];

    BrandService.GetBrands = function() {

        var req = {
            url: BrandURL,
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            data: JSON.stringify({Action: 'GET'})
        };

        if (BrandList.length) {
            return $q.when(BrandList);
        }

        return $http(req)
            .success(function(response) {
                BrandList = response.data
                alert('Brand Fetching is successful');
                return response.data;
            })
            .error(function(data, status, headers, config) {
                alert('Brand Fetching Error');
                alert(status);
                alert(data);
            });
    }

    return BrandService;
});

此外，您不需要创建虚拟延迟对象，您可以使用 $q.when 返回已解决的 promise .