角度 js ui-select 选项重复对对象数组不起作用

Question

我正在使用Angular ui-select。我的模型和ui-select选项数组是不同的。更改值时，它不会更新并且不显示选项。我将选定的对象 Id 存储在"pmpo"中，我想在加载时显示 pmptnk 对象数组中的选定对象。但是不起作用。有人说我做错了什么。

我的模型对象

pmpo:877
pmptnk:[0:
632:{id: "632",  pid: "2993", ESID: "9154", lb1: "Undddd", lb2: "219"}
877:{id: "877",  pid: "2993", ESID: "9154", lb1: "Pcddd", lb2: "29"}
654:{id: "654",  pid: "2993", ESID: "9154", lb1: "kukuu", lb2: "246"}]

在视图中的文件

<div ng-if="item.pmptnk.length > 0">
<ui-select ng-model="item.pmpo" click-out-side="closeThis($event)">
<ui-select-match placeholder="Select " search-placeholder="Filter Tanks" 
uib-tooltip="{{item.pmpo > 0 ? $select.selected.lb1 : 'Select Tank'}}" tab-select="true">
<span ng-bind="$select.selected.lb1"></span>
</ui-select-match>
<ui-select-choices repeat="obj.tid as obj in (item.pmptnk[item.pmpo])">
<span ng-bind="obj.lb1"></span>
</ui-select-choices>
<ui-select-no-choice>
No results matched "{{$select.search}}"
</ui-select-no-choice>
</ui-select>
</div>

Answer 1

根据ui-select-choices的文档，repeat属性

指定要作为选项提供的项目列表。语法类似 到 ngRepeat。

根据ng-repeat文档

可以让

ngRepeat 遍历一个属性 使用以下语法的对象：

<div ng-repeat="(key, value) in myObj"> ... </div>

因此，由此，我们可以得出结论，您应该从中更改语法：

<ui-select-choices repeat="obj.tid as obj in (item.pmptnk[item.pmpo])">

对此：

<ui-select-choices repeat="(key, value) in (item.pmptnk[item.pmpo])">

其中value将877、2993等，key将id、pid等等。

Answer 2

我处理了你的代码。我以不同的方式尝试了它。 下面是我的代码片段：

<div ng-if="item.pmptnk.length > 0">
<ui-select ng-model="item.selected" click-out-side="closeThis($event)">
<ui-select-match
placeholder="Select "
search-placeholder="Filter Tanks"
uib-tooltip="{{item.pmpo > 0 ? $select.selected.lb1 : 'Select Tank'}}"
tab-select="true"
>
<span ng-bind="$select.selected.lb1"></span>
</ui-select-match>
<ui-select-choices repeat="obj.tid as obj in (item.pmptnk)">
<span ng-bind="obj.lb1"></span>
</ui-select-choices>
<ui-select-no-choice>
No results matched "{{$select.search}}"
</ui-select-no-choice>
</ui-select>
</div>

我更改了我的模型，如下所示：

$scope.item = {};
$scope.item.pmpo = 877;
$scope.item.pmptnk = [
{ id: "632", pid: "2993", ESID: "9154", lb1: "Undddd", lb2: "219" },
{ id: "877", pid: "2993", ESID: "9154", lb1: "Pcddd", lb2: "29" },
{ id: "654", pid: "2993", ESID: "9154", lb1: "kukuu", lb2: "246" },
];
for (var i = 0; i < $scope.item.pmptnk.length; i++) {
if ($scope.item.pmptnk[i].id == $scope.item.pmpo) {
$scope.item.selected = $scope.item.pmptnk[i].tid;
break;
}
}

这对我来说很好用。

Answer 3

不应该是ng重复而不是只是重复吗？

<ui-select-choices repeat="obj.tid as obj in (item.pmptnk[item.pmpo])">

将此行更改为以下行

<ui-select-choices ng-repeat="obj.tid as obj in (item.pmptnk[item.pmpo])">

它有望解决问题。