在AngularyJs中，为什么我的ng-model值没有设置所选的选项？

Question

我有4个选项的选择。该值在ng-init上设置，并且只能由用户从该点更改。我的所有初始函数都接受ng-init设置的值并更改值，但未显示所选值。

<select name="resultShow" class="result-show" ng-init="resultShow=25" ng-change="updateProd(resultShow,prodState,prodType,prodStyle,prodBrand,keywords)" ng-model="resultShow">
    <option value="25">25</option>
    <option value="50">50</option>
    <option value="75">75</option>
    <option value="100">100</option>
</select>

Answer 1

检查此功能。我正在使用ng-change来检测更改。在其中我只记录resultShow的值，我可以看到它获取所选的选项值。

Fiddle Demo

Answer 2

这是因为如果模型的viewValue与select选项中存在的值之一不匹配，select将添加默认选项。

resultShow = 25的viewValue为25，数字数据类型。

目前select可以绑定数据类型字符串的值。因此存在不匹配。为了使它工作，我们需要使用字符串数据类型

使resultShow的viewValue为25

ng-init ="resultShow = '25'"

将填充选择下拉列表。但是数据类型将被更改。

作为解决方法，请在控制器中尝试$ scope.resultShow = 25。这将解决问题。

此外，选择将在解析viewValue后自动删除添加的空选项。