NG-模式正从下拉列表中错误值 [英] ng-model is getting wrong value from dropdown

问题描述

我的NG-模型与第一个值在下拉打字的时候，当一些价值份额的标题开始字母更新。

My ng-model is updated with the first value when typing in a dropdown when some values SHARE start letters at captions.

 <div ng-app="dropDown" ng-controller="dropDownController">
      <select name="StateId" ng-model="selectedState" class="form-control" ng-change="selectedStateChanged()" ng-options="(states.Abbrev + ' - ' + states.Name) for states in states"></select>
      <span>{{selectedState.Name||''}}</span>
    </div>

Plnkr
http://plnkr.co/edit/pLVzK18iJxrmrL9Oiw4b?p=$p$pview

情景测试：

1. 单击窗体上的任何部分。


2. 单击选项卡集中下拉。


3. 开始键入TX

结果：
  - 德克萨斯州 - 得克萨斯州的选项将显示在drowpdown。
  - $ scope.selectedState值{名称：'田纳西州}

Result: - 'TX - TEXAS' option is displayed on drowpdown. - $scope.selectedState value IS {Name:'TENNESSEE'}

预期：

• 'TX - 德州。选项显示drowpdown


• $ scope.selectedState值应为{名称：'TEXAS'}

我要工作了这一点，通过使用普通的JavaScript，在此之前，我想知道如果theres任何AngularJS的解决方案在那里。

I'm gonna work this out by using plain javascript, in the meantime, I would like to know if theres any AngularJS solution out there.

先谢谢了。

推荐答案

我也遇到过一些问题，选择。这就是为什么它总是比较安全的添加一个空选项 -tag！

I also experienced some problems with select. That's why it is always safer to add an empty option-tag!

<div ng-app="dropDown" ng-controller="dropDownController">
  <select name="StateId" ng-model="selectedState" class="form-control" ng-change="selectedStateChanged()" ng-options="(states.Abbrev + ' - ' + states.Name) for states in states">
    <option></option>
  </select>
  <span>{{selectedState.Name||''}}</span>
</div>

解决方案： http://plnkr.co/edit/LfS347JM6V7Rv5S6vPkL?p= preVIEW

角文档说明问题：

如果ngModel的viewValue不匹配任何选项，则控制会自动添加一个未知选项，当不匹配解决它然后删除。

If the viewValue of ngModel does not match any of the options, then the control will automatically add an "unknown" option, which it then removes when the mismatch is resolved.

可选，单硬codeD元素，设置为空字符串值，可以嵌套到的元素。那么该元素将重新present空或未选中选项。

Optionally, a single hard-coded element, with the value set to an empty string, can be nested into the element. This element will then represent the null or "not selected" option.

这篇关于NG-模式正从下拉列表中错误值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！