angular-ui / ui-select：如何正确设置初始选定对象

This is my ui select in the view:

这是我在视图中的ui选择：

<ui-select ng-model="selectedLabel.selected" ng-disabled="fetchingLabels || working">
    <ui-select-match placeholder="">{{$select.selected.code}}</ui-select-match>
    <ui-select-choices repeat="label in labels| filterBy: ['name', 'code']: $select.search"> 
        <div ng-bind-html="label.code | highlight: $select.search"></div>
        <small ng-bind-html="label.name | highlight: $select.search"></small>
    </ui-select-choices>
</ui-select>

And this is the relevant code in my controller:

这是我控制器中的相关代码：

$scope.labels = [];
$scope.selectedLabel = {};
$scope.selectedLabel.selected = $scope.passedLabel; // This is an object passed 
                                                    // from the previous controller.
                                                    // The scope comes with it.


$scope.fetchLabels(); // This fetches the labels from the server
                      // and puts them in $scope.labels

The labels brought from the server are theoretically like these:

从服务器带来的标签理论上如下：

[{'labelId': 20, 'code': 'L20', 'name': 'some label'},
 {'labelId': 21, 'code': 'L21', 'name': 'other label'}, ...]

And the passed from-outside label, 'passedLabel', is theoretically like ONE of those in $scope.labels too, eg:

传递来自外部的标签'passLabel'在理论上也是$ scope.labels中的一个，例如：

  passedLabel = {'labelId': 21, 'code': 'L21', 'name': 'other label'}

...I say theoretically because, empirically, I'm seeing that they are different because of the things that angular adds to them (eg. $$hashKey, or __proto__).

......我说理论上是因为，根据经验，我看到它们是不同的，因为角度增加了它们（例如，$$ hashKey或__proto__）。

So, because of that difference, the $scope.selectedLabel.selected = $scope.passedLabel isn't matching the corresponding item in the ui-select (they are not the same object), and thus, the result of that is this behavior:

因此，由于存在这种差异，$ scope.selectedLabel.selected = $ scope.passedLabel与ui-select中的相应项不匹配（它们不是同一个对象），因此，结果就是这种行为：

How can I set the initial selection correctly? is there a way I can use id's instead of object comparisson? I want to avoid having a for like this:

如何正确设置初始选择？有没有办法可以使用id而不是object comparisson？我想避免像这样：

  for (i=0; i<$scope.labels; i++) {
      if ($scope.labels[i].labelId == $scope.passedLabel.labelId) {
           $scope.selectedLabel.selected = $scope.labels[i]
      }
  }

which I'm pretty sure it would work as expected, but I would have to call that for after the ajax has returned... and I have other ui-selects too

我很确定它能按预期工作，但是我必须在ajax返回之后调用它...而且我还有其他的ui选择

1 个解决方案

#1

If you want to achieve the state that you have mentioned, then simply pass the correct reference to your model.

如果您想要达到您提到的状态，那么只需将正确的引用传递给您的模型即可。

So after the success of the fetchlabel call you set the values in labels. Now in the success of this function you need to call the function that fetches presentLabel.

因此，在fetchlabel调用成功后，您可以在标签中设置值。现在，在此功能的成功中，您需要调用获取presentLabel的函数。

As soon as you get the data of present label you can get the index of that object in the labels scope.

只要获得当前标签的数据，就可以在标签范围内获取该对象的索引。

var idx;
_.find($scope.labels, function(label, labelIdx){ 
  if(label.labelId == parentLabel.labelId){ idx = labelIdx; return true;}; 
});

$scope.selectedLabel = {};
$scope.selectedLabel.selected = $scope.labels[idx];

This will solve your purpose.

这将解决您的目的。