angularjs - md-select 检查 md-options 中重复选项的标准是什么

标签 angularjs angular-material

我在我的项目中使用 Angular Material 有一段时间了。在使用 md-select 时,我遇到了一个问题,即出现重复的 md-option 值错误。

我知道 md-options 采用唯一值,我正在为 md-options 分配一个数组。然而,这是一个对象数组。所以我想知道用于区分对象的标准是什么。 API 对此没有多说。

我的用例要求根据另一个 md-select 的选择更改 md-select 的 md-options。所以我正在观察第一个 md-select 的选择,并在其更改和更新第二个 md-select 的 md-options 时触发 watch 。

下面是我用来将数组分配给 md-options 的方法:

$scope.$watch('search.selectedTrades', function(newTrades, oldTrades) {
    if ((newTrades.length === 0)) {
        $rootScope.search.selectedTrades = oldTrades;
        return;
    }
    if ($rootScope.search.selectedTrades && $rootScope.search.selectedTrades.length > 0) {
        if (!$rootScope.identity.isClusterManager) {
            $rootScope.search.selectedTrades = newTrades;
            SearchFilterData.setSelectedTrades(newTrades);
            $rootScope.search.selectedClusters = [];
            $scope.clusters = [];
            $scope.subareas = [];
            var clusterKeys = [];
            $rootScope.search.selectedTrades.forEach(function(t) {
                t.lstClusters.forEach(function(c) {
                    if (clusterKeys.indexOf(c.ClusterKey) == -1) {
                        clusterKeys.push(c.ClusterKey);
                        $scope.clusters.push(c);
                    }
                })
            })
        }
    } else {
        $scope.clusters = [];
        $scope.subareas = [];
        $rootScope.search.selectedClusters = [];
        $rootScope.search.selectedSubAreas = [];
        SearchFilterData.setSelectedTrades($rootScope.search.selectedTrades);
    }
});

在上面的代码中,clusterKey 是每个对象的唯一实体。所以我用它来将唯一值插入数组。 然而,在我选择和取消选择各种选项之后,这种情况发生在一些随机场景中。请告知我做错了什么以及将两个对象标记为重复的标准是什么

最佳答案

你没有提供你的标记,所以我不能确定,但​​在我的例子中,问题是由于省略了 md-option 标签中“值”属性的双 curl 引起的。

这很糟糕:注意缺少的大括号

<md-option ng-repeat="item in vm.list" value="item.id">{{item.text}}</md-option>

这不是:

<md-option ng-repeat="item in vm.itemlist" value="{{item.id}}">{{item.text}}</md-option>

我相信这失败的原因是每个项目将被放入选项列表中,并将被赋予“item.id”的值(字面意思)。它将在重复的第二次迭代中失败。 使用大括号会导致使用“item.id”中的值。

希望这对您有所帮助。

关于angularjs - md-select 检查 md-options 中重复选项的标准是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34171709/

相关文章:

angularjs - 将 ajax 请求转换为 Angular $http

javascript - Angularjs 路由在没有 # 的情况下抛出 404

javascript - 使用 Angular.js 和 php 进行延迟加载 + 轮询

javascript - 需要用 angularjs 再次停止点击

Angular 8 和 Angular Material : Drag Scrolling with CdkDropList item

css - 更改禁用 Material 填充输入的背景

angularjs - 在不使用 ng-repeat 的情况下在 AngularJS 中显示数组中的一项

css - 背景没有填满窗口的高度

javascript - Angular : Cannot read property 'on' of undefined

angular - 要在 Angular Material 中单击按钮时启用或禁用选择组件