Question

这是我的控制器

angular.module("app").controller('myController', ['$scope', '$filter','$rootScope','contentService','$location','$anchorScroll', function ($scope, $filter,$rootScope,contentService,$location,$anchorScroll) {

$scope.searchContents = [] ;

var filterList = function (list, keyword) {
    return $filter('filter')(list, keyword);
};

var addToSearchContents = function (list,type){
    _.each(list,function(item){
        item.type = type;
        $scope.searchContents.push(item);
    });     
};

$scope.init = function(){
    var str = $location.absUrl();
    $scope.searchKeyword = str.substring(str.indexOf("=") + 1,str.length);

    !_.isEmpty($scope.searchKeyword)
    {
        // get all songs
        contentService.getAllSongs().then(function (result) {
            var filteredSongs = filterList(result.data.songs, $scope.searchKeyword);
            addToSearchContents(filteredSongs,"song");
        });

        // get all people
        contentService.getAllPeople().then(function (result) {
            var filteredPeople = filterList(result.data.people, $scope.searchKeyword);
            addToSearchContents(filteredPeople,"people");
        });           

        _.each($scope.searchContents,function(item){

             alert("item -> "+item.type);
        });
    }
};

$scope.init();

}]);

Items(objects)被添加到$scope.searchContents中的变量addToSearchContents，但是如果我尝试访问/迭代所有被$scope.searchContents推送到_.each的对象似乎null。但我可以使用ng-repeat访问HTML页面中的所有内容，但不能在控制器中访问。我很困惑，我错过了什么。

Answer 1

您收到错误，因为当您致电_.each($scope.searchContents...时，数据尚未从异步调用中到达。 addToSearchContents尚未执行。

使用$q.all，将所有承诺合并到巨人身上。然后在所有承诺得到解决后做点什么。

注意：请记住将服务$q注入您的控制器。

$q.all([
    contentService.getAllSongs(),
    contentService.getAllPeople()
]).then(function (result) { 
    // `result` is an array containing the results from the promises.

    var filteredSongs = filterList(result[0].data.songs, $scope.searchKeyword);
    addToSearchContents(filteredSongs,"song");

    var filteredPeople = filterList(result[1].data.people, $scope.searchKeyword);
    addToSearchContents(filteredPeople,"people");

    _.each($scope.searchContents,function(item){
        alert("item -> "+item.type);
    });
});

我没有您的编码上下文，因此为您创建了类似的JSFiddle。它说明了同样的想法。

Answer 2

另一种变体，也是$q.all：

$q.all([
    // get all songs
    contentService.getAllSongs().then(function (result) {
        var filteredSongs = filterList(result.data.songs, $scope.searchKeyword);
        addToSearchContents(filteredSongs,"song");
    }),

    // get all people
    contentService.getAllPeople().then(function (result) {
        var filteredPeople = filterList(result.data.people, $scope.searchKeyword);
        addToSearchContents(filteredPeople,"people");
    })]).then(function(){         
        // here all items already added so we can iterate it
        _.each($scope.searchContents,function(item){
            alert("item -> "+item.type);
        });
    });

angular js - 无法访问控制器中推送到阵列的对象

2 个答案: