ng-重复基于$scope列表的过滤器

ng-repeat with filter based upon $scope list

本文关键字：scope 列表 过滤器 ng-      更新时间：2023-09-26

这是关于AngularJS的。

我$scope中有 2 个列表：

$scope.cars = [{ name: 'Audi', price: '...' }, { name: 'BMW', price: '...' }];
$scope.favorites = ['Audi'];

我正在 HTML 中生成一个"添加到收藏夹"列表：

<ul>
    <li ng-repeat="car in cars"><button ng-click="addToFav($index)">Add to favourite</button></li>
</ul>

但我不想在我最喜欢的列表中已经存在的汽车上安装"添加到"按钮。

这可能吗：

... | filter {}

在 ng 重复语句中？

创建过滤器：

angular.module('app').filter('isNotInArray', function () {
    return function (arr, targetArr, prop) {
        return arr.filter(function (item) {
            return targetArr.indexOf(item[prop]) === -1;
        });
    };
});

然后使用：

<li ng-repeat="car in cars | isNotInArray:favorites:'name'">

您还可以在汽车列表中添加新密钥并检查 usgin ng-if 条件

    $scope.cars = [{ name: 'Audi', price: '...', isFav:true }, { name: 'BMW', price: '...', isFav:false }];
    $scope.favorites = ['Audi'];
相关文章：