0

好的，我知道这已经被覆盖了，我已经尝试了所有这些结果，但无法让它们在我的情况下工作：

我正在尝试将角度 ui-select 与多个数据源一起使用 - 一个用于默认选择，另一个用于可选选项，但不应发生重复

例如：

对于 ng-model 绑定，我在 $scope 上使用了一个空数组，该数组填充了与来自名为“categories”的 API 端点的帖子相关联的类别。

对于默认选择的选项，我正在获取已经与 post 对象关联的类别 - 这来自另一个 api 端点。

我的控制器

app.controller('MainCtrl', function($scope, $http) {

    $scope.selectedTerms = [];

$http.get('currentTerms.json').then(function(currentTermsObj){

    var currentTerms = currentTermsObj.data;

        currentTerms.map(function(currentTerm){

        var currentPostTerm = currentTerm;

        $scope.selectedTerms.push(currentPostTerm); 
        });
  });



$http.get('possibleTerms.json').then(function(possibleTermsObj){

  $scope.possibleTerms = possibleTermsObj.data;

  });

我的 HTML：

    <ui-select
        multiple
        ng-model="selectedTerms">
        <ui-select-match placeholder="Select Category...">{{$item.name}}</ui-select-match>
        <ui-select-choices
            repeat="term in possibleTerms">
        {{term.name}}
        </ui-select-choices>
    </ui-select>

问题是，无论我做什么，总是有重复和角度怪胎，并出现以下错误：

“错误：[ngRepeat:dupes] 不允许在转发器中重复。使用 'track by' 表达式指定唯一键。”

哦，我试过使用“track by $index”，但没有运气。

当它们已经来自另一个数据源时，如何使用两个不同的数据源并让 ui-select 从选择下拉列表中删除重复项？

Plnkr 演示我的问题：http ://plnkr.co/edit/WDthr7?p=preview

4

2 回答 2

1

添加过滤器 "<ui-select-choices/>"

<ui-select-choices repeat="color in availableColors | filter:$select.search">

演示 uiselect - plunker

（或）在你的标签中使用 id 或 name 跟踪 <ui-select-choices/>（这个对我有用）

<ui-select multiple ng-model="selectedTerms">
        <ui-select-match placeholder="Select Category...">{{$item.name}}</ui-select-match>
 <ui-select-choices repeat="term in possibleTerms track by term.name">  
 {{term.name}}
        </ui-select-choices>
    </ui-select>
于 2016-07-18T15:03:17.267 回答
0

另一种方法是自己合并它们。见http://plnkr.co/edit/NPdxYK8fqCPMhsKXRSGH?p=preview

在控制器中： -

$http.get('currentTerms.json').then(function(currentTermsObj){

    var currentTerms = currentTermsObj.data;

        currentTerms.map(function(currentTerm){

        var currentPostTerm = currentTerm;

        $scope.selectedTerms.push(currentPostTerm); 
        });

        $http.get('possibleTerms.json').then(function(possibleTermsObj){

            $scope.possibleTerms = possibleTermsObj.data;
            for(var i = 0; i < $scope.possibleTerms.length; i++){
              if(i < $scope.selectedTerms.length){

              $scope.possibleTerms[i] = $scope.selectedTerms[i];
            }
         }   
      });
  });

请注意，上述合并逻辑仅适用于本示例以节省时间。

于 2016-01-22T02:41:35.673 回答