I am using Angular ui-select. My model & ui-select option array are different. While changing value its not updated and not displaying options. I am storing the selected object Id in "pmpo", I want to show the selected object from the pmptnk object array when loading. But is not working. Some one tell what I am doing wrong.
My object from Model
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"}]
In view file
<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>
I worked on your code.I tried it out in different way. Below is my code snippet:
<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>
and i changed my model as below:
$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;
}
}
This worked fine for me.