不能在ng-click函数中使用.then()

时间:2016-01-22 15:28:55

标签: javascript angularjs

我的控制器看起来像这样

function menuController($scope, dataService) {

    $scope.getMenuItem = '';      
    $scope.submenu = new Array();

    var setMenuItems = function (w) {
        $scope.submenu = new Array();
        $.each(w, function (i, val) {

            if ($scope.getMenuItem == 'year') {
                $scope.submenu.push( {
                    name: val[0].year, link: year

                });
            }

        });
    }
    $scope.UpdateSubmenu = function (a) {
        $scope.getMenuItem = a;

        loadData();
    };
    var loadData = function () {
        dataService.getAlbums().then(setMenuItems);
    }
    loadData();

}

在初始化期间调用loadData()时,它可以正常工作。但是,当从UpdateSubmenu调用它时,它会失败并显示TypeError: dataService.getAlbums(...).then is not a function

UpdateSubmenu功能从ng-click事件激活。

dataService看起来像这样

(function () {
    "use strict";
    var dataService = function ($http) {
        var albums;

    var getAlbums = function () {
        if (albums)
            return albums;
        return $http.get("./api/Album").then(function (response) { albums = response.data; return albums; });
    }

    return { getAlbums: getAlbums };


}
angular.module("Main").factory("dataService", dataService);
}());

为什么我不能使用then()

2 个答案:

答案 0 :(得分:4)

问题是因为您正在缓存相册并返回相册(如果存在)。第一次调用getAlbums()时,它会返回$http承诺,第二次返回一个没有then()方法的专辑数组。

我通常通过使用$q创建承诺并立即解决它来处理此问题:

(function () {
    "use strict";
    var dataService = function ($http, $q) {
        var albums;

        var getAlbums = function () {

            if (albums) {
                var deferred = $q.defer();
                deferred.resolve(albums);
                return deferred.promise;
                // ... or more simply ...
                //return $q.when(albums);
            }
            else {
                return $http.get("./api/Album")
                    .then(function (response) { albums = response.data; return albums; });
            }
        }

        return { getAlbums: getAlbums };    
    }

    angular.module("Main").factory("dataService", dataService);
}());

答案 1 :(得分:3)

而不是返回专辑...返回$q.resolve(albums)简而言之......链接一个承诺(使用.then())你必须返回总是返回一个承诺。