Question

我有一个下拉列表;

<select class="form-control" data-ng-model="selected_category" data-ng-change="search(true, true)">
    <option value="0">Select Category</option>
    <option value="{{category.id}}" data-ng-repeat="category in categories">{{category.name}}</option>
</select>

哪种方法很完美。但是，我正在操纵Angular之外的范围（有效理由）并且我使用它（它在coffeescript中但很容易理解）

scope.$apply (s) ->
  s.units = _me.attr('data-units')
  s.selected_category = parseInt(_me.attr('data-category'))

  s.search(true,true)

它出现，因为所有内容都取决于$scope.selected_category变量的变化（正确的产品/文字出现）但如果我选择了{{1 （IE：自更改后未更改）并且如果选择了其他任何内容则保持不变。当我在chrome中使用元素检查器时查看空白下拉列表我可以看到：

Select Category

这是怎么回事？

Answer 1

您似乎错过了ng-selected上的option属性，让Angular知道当前选择了哪个选项：

<select class="form-control" data-ng-model="selected_category" data-ng-change="search(true, true)">
    <option value="0">Select Category</option>
    <option value="{{category.id}}" data-ng-selected="selected_category.id == category.id" data-ng-repeat="category in categories">{{category.name}}</option>
</select>

但是，如果您不需要执行任何操作，则最好使用ng-options。所以，我建议（正如@TheSharpieOne在评论中提到的那样），你改为：

 <select ng-model="selected_category" ng-options="c.name for c in categories">
    <option value="">Select Category</option>
 </select>

如果您需要按id进行跟踪，请使用track by子句：

 <select ng-model="selected_category" ng-options="c.name for c in categories track by c.id">
    <option value="">Select Category</option>
 </select>

$ scope。$ apply make dropdown act很奇怪

1 个答案: