避免在Angular.js的ng-repeat collection中添加重复项

avoid adding duplicating items in ng-repeat collection, in Angular.js

本文关键字:添加 collection ng-repeat Angular js      更新时间:2023-09-26

我有一个像这样的点击事件:

$scope.submitInfo = function myfunction() {
        var itemToAdd = {
            Id : generateUUID(),
            Name: $scope.Name,
            Email: $scope.Email,
            Phone: $scope.Phone
        };
        $scope.Info.push(itemToAdd);
    }

我的问题是,我想检查相同的IDName是否在$scope.Info收集中不存在。

我纯粹专注于angular.js,我正在寻找这种场景的最佳解决方案

你可以使用$filter.

像这样:

$scope.submitInfo = function myfunction() {
    var itemToAdd = {
        Id : generateUUID(),
        Name: $scope.Name,
        Email: $scope.Email,
        Phone: $scope.Phone
    };
    var foundElement = $filter('filter')($scope.Info, {Name: $scope.Name}, true);
    if (foundElement.length === 0) {
        $scope.Info.push(itemToAdd);
    }
};
当然,你需要在你的controller/factory/whatever中注入$filter

试试这个-在你的提交函数中写下面的代码,即

$scope.submitInfo = function myfunction() {
    var itemToAdd = {
        Id : generateUUID(),
        Name: $scope.Name,
        Email: $scope.Email,
        Phone: $scope.Phone
    };
    if(($scope.Info.indexOf(itemToAdd.id) != -1) || ($scope.Info.indexOf(itemToAdd.Name) != -1) {
         $scope.Info.push(itemToAdd);
    }
}

您可以使用本地Javascript过滤器(IE8不支持)来检查是否有具有该名称的元素:

var duplicates = $scope.Info.filter(function(item) {
    return item.Name = $scope.Name;
});
var nameExists = duplicates.length > 0;

和你的完整方法:

$scope.submitInfo = function myfunction() {
    var duplicates = $scope.Info.filter(function(item) {
        return item.Id = $scope.Name;
    });
    var nameExists = duplicates.length > 0;
    if (!nameExists) {
        var itemToAdd = {
            Id : generateUUID(),
            Name: $scope.Name,
            Email: $scope.Email,
            Phone: $scope.Phone
        };
        $scope.Info.push(itemToAdd);
    }
}