当前位置: 首页 > 面试题库 >

从Angular JS ng-options / ng-repeat中删除重复项

印高阳
2023-03-14
问题内容

我有以下几点:

$scope.jsonmarkers = [{
    "name": "Jeff",
        "type": "Organisation + Training Entity",
        "userID": "1"
}, {
    "name": "Fred",
        "type": "Organisation + Training Entity",
        "userID": "2"
}];

而这在我的HTML:

<select id="typeselect"  multiple  ng-options="accnts.type for accnts in jsonmarkers" ng-model="accnt" ng-change="changeaccnt(accnt.type)"></select>

我该如何匹配类型并在每次出现时仅回显一次ng-options呢?


问题答案:

要删除重复项,可以使用AngularUI 的 唯一
过滤器(源代码在这里:AngularUI唯一过滤器),然后直接在ng-options(或ng-
repeat)中使用它。

在这里查看更多: 独特的东西

json结构中也存在语法错误。

工作守则

HTML

<div ng-app="app">
    <div ng-controller="MainController">
        <select id="typeselect"  ng-options="accnts.type for accnts in jsonmarkers | unique:'type'" ng-model="accnt" ng-change="changeaccnt(accnt.type)" multiple></select>
    </div>
</div>

脚本

    var app = angular.module("app", []);

app.controller("MainController", function ($scope) {
    $scope.jsonmarkers = [{
        "name": "Jeff",
            "type": "Organisation + Training Entity",
            "userID": "1"
    }, {
        "name": "Fred",
            "type": "Organisation + Training Entity",
            "userID": "2"
    }];
});


app.filter('unique', function () {

    return function (items, filterOn) {

        if (filterOn === false) {
            return items;
        }

        if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
            var hashCheck = {}, newItems = [];

            var extractValueToCompare = function (item) {
                if (angular.isObject(item) && angular.isString(filterOn)) {
                    return item[filterOn];
                } else {
                    return item;
                }
            };

            angular.forEach(items, function (item) {
                var valueToCheck, isDuplicate = false;

                for (var i = 0; i < newItems.length; i++) {
                    if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
                        isDuplicate = true;
                        break;
                    }
                }
                if (!isDuplicate) {
                    newItems.push(item);
                }

            });
            items = newItems;
        }
        return items;
    };
});


 类似资料:
  • 问题内容: 我有一本字典存放在 现在,我不想包含重复的,我应该使用什么? 问题答案: 只需创建一个可以通过键获取唯一值的过滤器即可。这样的事情应该做(我根本没有测试过,所以我把这件事留给你,这只是给你一个主意): 注意:Array.indexOf()在IE8中不起作用 ,因此,如果支持IE8,则需要在indexOf()中存根,或者需要使用稍微不同的方法。 其他想法:如果已经在引用那些库,那么最好创

  • 问题内容: 我希望解决三个问题… 在我的应用程序页面中,我有一个选择州,另一个选择县。对于州,我有: 数据: 对于我的县,请选择: 数据: 这是我的: 因此,如您所见,我在州选择上使用,在县选择上使用,在县数据集中已设置了相应的州ID 。 我想做几件事: 隐藏选择的县,直到选择了一个州。 选择州后,按选定的/ 过滤县选择选项 筛选由第一,然后由。 我还没有看到一个方法来设置到或过滤器由一个数字,而

  • 问题内容: 我有一个自定义对象的ArrayList。我要删除重复的条目。 对象具有三个字段:和。如果字幕多次出现,那么我只需要带有thats字幕的第一项(忽略带有该字幕的其余对象)。 问题答案: 您可以使用自定义Comparator将ArrayList的内容放入TreeSet中,如果两个字幕相同,则应返回0。之后,您可以将Set转换为列表,并使列表中没有“重复项”。这是对象的示例,您当然应该使用正

  • 问题内容: 数据库类型为PostGres 8.3。 如果我写了: 我有一些计数超过1的行。如何取出重复的行(我仍然希望每个行都保留1行,而不是+1行…我不想删除所有行。) 例子: 应该变成: 我找到的唯一答案是 在那里,但是我想知道是否可以在没有哈希列的情况下做到这一点。 警告 我没有具有唯一编号的PK,因此无法使用min(…)技术。PK是3个字段。 问题答案: 这是所有表都应具有主键的众多原因之

  • 本文向大家介绍Angularjs的ng-repeat中去除重复数据的方法,包括了Angularjs的ng-repeat中去除重复数据的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了Angularjs的ng-repeat中去除重复数据的方法。分享给大家供大家参考,具体如下: 一、JS: 二、Html: 希望本文所述对大家AngularJS程序设计有所帮助。

  • 问题内容: 我正在努力解决一个特殊的用例。我在底部提供了一个jsfiddle代码段。 1. HTML表 我的HTML是一张桌子。指令必须应用于html元素。在我的用例中,这不能完成,因为ng-repeat的实例由double tr元素组成: AngularJS不提供语法ng- repeat注​​释(与KnockoutJS不同)。我在SO上发现了类似的问题。但是,用例包括在元素内附加HTML。我的工