Angularjs选择具有多个静态选项的选项答案

【问题标题】：Angularjs Select option with multiple static optionsAngularjs选择具有多个静态选项的选项
【发布时间】：2013-06-20 17:16:08
【问题描述】：

我有一个带有ng-options 的选择元素来填充选项，<option value="">Select</option> 作为静态默认选项。我想在选项列表中显示另一个项目 - Other，如果选中，则呈现 textbox 供用户输入其他值。我尝试使用 value="-1" 添加另一个静态选项，但没有成功。

【问题讨论】：

你为什么不把那个选项也添加到ng-options 呢？这样，您可以在选择时查看模型，当它更改为“其他”时，您可以使用 ng-show? 显示文本框
@callmekatootie 是的，我考虑过。我想知道是否有更好的方法。
能否提供您的代码，以便我们进一步分析？

标签： angularjs

【解决方案1】：

我会尝试以下：

<div ng-init="arr = [{name:'A', val:1},{name:'B', val:2},{name:'C', val:2}]">
  <select ng-model="v">
    <option ng-repeat="o in arr" value="o.val">{{ o.name }}</option>
    <option>Other</option>
  </select>
  <input type="number" ng-model="otherval" ng-show="v == 'other'"/>
</div>

或者，

<div ng-init="arr = [{name:'A', val:1},{name:'B', val:2},{name:'C', val:2}]">
  <select ng-model="v" ng-options="o.val as o.name for o in arr.concat([{name:'Other',val:'other'}])">
  </select>
  <input type="number" ng-model="otherval" ng-show="v == 'other'"/>
</div>

【讨论】：

我继续在我的选项集合中添加Other 选项。唯一的缺点是我必须验证如果选择的值是 other 然后丢弃选择模型值并采用其他输入值