これはビューでの私の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>
そして、これは私のコントローラーの関連コードです:
$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
サーバーから取得されたラベルは、理論的には次のようになります。
[{'labelId': 20, 'code': 'L20', 'name': 'some label'},
{'labelId': 21, 'code': 'L21', 'name': 'other label'}, ...]
また、渡された from-outside ラベル 'passedLabel' は、理論的にはそれらの 1つに似てい$scope.labels
ます。たとえば、次のようになります。
passedLabel = {'labelId': 21, 'code': 'L21', 'name': 'other label'}
...私が理論的に言っているのは、経験的に、角度がそれらに追加するもののためにそれらが異なることがわかっているからです(たとえば$$hashKey
、または__proto__
)。
したがって、その違いにより、$scope.selectedLabel.selected = $scope.passedLabel
は ui-select の対応する項目と一致しません (それらは同じオブジェクトではありません)。したがって、その結果は次の動作になります。
初期選択を正しく設定するにはどうすればよいですか? オブジェクト比較の代わりに ID を使用する方法はありますか? 私はこのようなことを避けたいfor
:
for (i=0; i<$scope.labels; i++) {
if ($scope.labels[i].labelId == $scope.passedLabel.labelId) {
$scope.selectedLabel.selected = $scope.labels[i]
}
}
これは期待どおりに機能すると確信していますがfor
、ajaxが戻った後にそれを呼び出す必要があります...そして、他のUI選択もあります