时间戳

首页 > 解决方案 > 当我通过 ui-tabset 中的 select 更改我的 $scope.model 时，它不会相应更改

angularjs - 当我通过 ui-tabset 中的 select 更改我的 $scope.model 时，它不会相应更改

问题描述

目前我在一个 ui-tabset 内部，当它在一个 tabset 内部时，当我将它设置为模型时，<select> 它似乎没有正确更新我。$scope.filter_item_package

这是我的代码： HTML：

<uib-tab index="2" heading="All Harvest Plans">
  <select class="form-control"  ng-model='filter_item_package' ng-change='package_change()' >
   <option ng-repeat=" items in cases_filter_items" ng-selected="{{items.t2}}" value="{{items.t2}}">{{items.t3}}
   </option>
  </select>
</uib-tab>

JS：

$scope.filter_item_package = 'Cases'
 $scope.cases_filter_items = [
{'id':1,'t2':'Cases','t3':'Show Cases'},
{'id':2,'t2':'Acres','t3':'Show Acres'},
{'id':2,'t2':'Palettes','t3':'Show Pallettes'}
]
$scope.package_change = function(){console.log($scope.filter_item_package)}

但是当我没有嵌套在 ui-tabs 中的选项时，它会正确更新。例如，当我更改为 Acres 或 Palettes 时，它会相应地 console.log。这只是正在发生的事情的粗略草图。

标签： angularjsangular-ui-bootstrapangular-bootstrap

解决方案

我可以看出你的草稿至少有一个问题。

当你写的时候ng-selected="{{items.t2}}"，你是在说：

如果items.t2返回true，则设置此元素的selected属性。

并且因为items.t2返回一个字符串，它在 Javascript 中是 'truthy'，所以您将所有 ng-repeat 实例设置为selected默认值。

相反，使用ng-selected="items.t2 === filter_item_package". 请注意，{{}}ng-* 指令不需要。

推荐阅读