ng-options在值中添加“string:”而不是更新ng-model

时间:2016-06-13 13:47:20

标签: angularjs

我有这样的数据:

"RequirementLevels": {
 "285960000":"Black",
 "285960001":"Green",
 "285960002":"Blue",
 "285960003":"Purple"
}

我有一个像这样的选择:

<select ng-options="key as value for (key , value) in Variables.Template.RequirementLevels"
        ng-model="Variables.EditingNode.RequirementLevel"
        ng-model-options="{ debounce: 300 }"></select>
<span>"{{Variables.EditingNode.RequirementLevel}}"</span>

这会产生以下html: enter image description here

请注意选择选项中每个值前面的string:。使用下面的代码,我没有在值中获得string:

<select ng-model="Variables.EditingNode.RequirementLevel">
     <option ng-repeat="(key, value) in Variables.Template.RequirementLevels" value="{{key}}">{{value}}</option>
</select>

我的问题是为什么我在ng-option列表中得到string:,如何让它消失。

由于评论,

更新:我想要更改此内容的原因是,当值中包含string:时,ng-model值无效。我认为这是因为它与模型中设置为“123”的选项中的“string:123”不匹配。

更新2

这是创建选择的Html。

<div class="form-group input-group">
    <label for="ReviewDone">Requirement level</label>
    <select ng-options="key as value for (key , value) in Variables.Template.RequirementLevels track by key"
            ng-model="Variables.EditingNode.RequirementLevel"
            ng-model-options="{ debounce: 300 }"></select>
    <span>"{{Variables.EditingNode.RequirementLevel}}"</span>
</div>

这会使用选项创建选择,但不会选择默认值。显示ng-model变量内容的正下方的范围可以正常工作并打印选项列表中的数字“285960002”,因此应该从列表中选择它以开始。

以上代码生成此HTML:

<div class="form-group input-group">
    <label for="ReviewDone">Requirement level</label>
    <select class="ng-pristine ng-untouched ng-valid" ng-model="Variables.EditingNode.RequirementLevel" ng-model-options="{ debounce: 300 }" ng-options="key as value for (key , value) in Variables.Template.RequirementLevels track by key"><option selected="selected" value="?"></option><option value="285960000" label="Black">Black</option><option value="285960001" label="Green">Green</option><option value="285960002" label="Blue">Blue</option><option value="285960003" label="Purple">Purple</option></select>
    <span class="ng-binding">"285960002"</span>
</div>

同样在select中选择一个不同的值会更改范围中的值,因此它会更新值,但在加载时不会读取它。

1 个答案:

答案 0 :(得分:4)

如果您想让这个额外的字符串消失,请按按键跟踪

<select ng-options="key as value for (key , value) in Variables.Template.RequirementLevels track by key"

请参阅plunker以供参考

http://plnkr.co/edit/fi8lLyjkS0y3hfX7aeNI?p=preview