比较Angularjs中2个数组之间的对象

I'm trying to figure the best way to do this, given that there will be a lot of data and I don't want to have giant loops hogging up resources. I have a lot of regular javascript/jquery experience, but am new to Angular and want to do it with Angularjs best practices.

我试图找到最好的方法来实现这一点,因为会有大量的数据而且我不想让巨大的循环占用资源。我有很多常规的javascript / jquery经验,但我是Angular的新手,并希望使用Angularjs最佳实践。

I have a list of items and users can "favorite" them. When viewing all items, I'd like to show the ones that favorited by marking them with an indicator. Both items and favorites are in separate tables and returned as JSON with different IDs.

我有一个项目列表,用户可以“喜欢”它们。在查看所有项目时,我想通过用指标标记它们来显示所关注的项目。项目和收藏夹都位于单独的表中,并以具有不同ID的JSON形式返回。

JS:

$scope.favorites = [];//$http.get of JSON file
$scope.items = [];//$http.get of JSON file

$scope.isFavorite = function(itemId) {
    var len = $scope.favorites. !== 'undefined' ? $scope.favorites.length : 0;
    for(var i = 0; i < len; i++) {
        if($scope.favorites[i].id === itemId) {
            return true;
        }
    }
};

HTML:

<div ng-repeat="item in items">
    <i ng-class="isFavorite(item.id) ? 'icon-bookmark' : 'icon-bookmark-empty'"></i>
</div>

I have a couple other checks for "isFavorite" so I'm trying to figure the best way to compare the 2 without checking every time in a loop. Any suggestions?

我有几个其他检查“isFavorite”所以我试图找出比较2的最佳方法,而不是每次在循环中检查。有什么建议么?

1 个解决方案

#1

The most optimal way I can think of would be to modify the $scope.items array once the favourites http request has returned it's data, and set a 'favourite' boolean property on each item.

我能想到的最佳方法是在收藏夹http请求返回其数据后修改$ scope.items数组,并在每个项目上设置“收藏”布尔属性。

That way, your isFavourite method will not trigger on each digest cycle. For example:

这样,你的isFavourite方法不会在每个摘要周期触发。例如:

var promises = [$http.get('/items'), $http.get('/favourites')];

$q.all(promises).then(function (resultsArray) {

    $scope.items = resultsArray[0];
    var favourites = resultsArray[1];

    $scope.items.forEach(function (item) {
        var matches = favourites.filter(function (f) {
                return f.id === item.id;
            });
        item.favourite = matches.length ? true : false;
    });

});

It's also worth bearing in mind that you probably want to wrap both http requests in a $q.all method so that you can fire a single callback once both http requests have finished.

同样值得注意的是,您可能希望在$ q.all方法中包装两个http请求,以便在两个http请求完成后可以触发单个回调。

EDIT: updated to show full code with $q.all implementation

编辑:更新以显示$ q.all实现的完整代码

#1