“粘性”选择Angular应用程序

Question

对于具有基于Angular的前端的应用，我遇到了一个恼人的问题。某个选择框是“粘滞的” - 您必须选择两次选项才能更改它。这是一个重现问题的片段：

{{1}}

知道出了什么问题以及如何解决这个问题？

Answer 1

您无需使用ng-selected选择自己的选项，ng-model会为您选择。

这导致模型混淆。这就是为什么你必须选择它两次。

 <select name="specific_for_dealership" ng-model="news.specific_for_dealership">
        <option value="">All</option>
        <option ng-repeat="dealer in dealers"  value="{{ dealer.dealerid }}">{{ dealer.name }}</option>
 </select>

我个人推荐的其他内容是切换到ng-options以显示对象的选项列表。它将为您提供更多功能。例如，您可以将整个对象绑定到选择器而不仅仅是ID。

<select name="specific_for_dealership" 
     ng-options="dealer.dealerid as dealer.name for dealer in dealers" 
     ng-model="news.specific_for_dealership">
        <option value="">All</option>
</select>

Answer 2

只需设置ng-selected="dealer.dealerid === news.specific_for_dealership"

即可