Angular ng-options 到 ng-repeat 带有额外的选项答案

【问题标题】：Angular ng-options to ng-repeat with extra optionsAngular ng-options 到 ng-repeat 带有额外的选项
【发布时间】：2016-02-12 18:25:04
【问题描述】：

我有一个<select> 元素，我使用ng-options 添加插入可用值，我的代码就像

<select ng-model="selectedCollection"
    ng-options="collection.collectionName for collection in seriesCollection">
</select>

这很好用，在 $scope.selectedCollection 我有整个 collection 对象。

现在我需要根据一些参数添加一些额外的<option> 元素。我认为最好的方法是避免使用ng-options 并做这样的事情

<select ng-model="selectedCollection"
    <option value='c1' ng-if="case1">somevalue</option>
    <option value='c2' ng-if="case2">somevalue2</option>
    <option ng-repeat="collection in seriesCollection">
        {{ collection.collectionName }}
    </option>
    <option value='c3' ng-if="case3">somevalue3</option>
</select>

这样selectedCollection 在选择“静态”选项时包含一个名为 c1、c2 或 c3 的字符串，但我希望它在选择其中一个时包含整个 collection 对象。

我尝试使用<option ng-repeat="collection in seriesCollection" value="{{ collection }}">，但存储的值不是collection 对象，而是表示它的序列化的字符串。我该怎么办？

【问题讨论】：

在您的选项中尝试ng-value。
似乎不起作用，这样selectedCollection 变量包含像"[object Object]" 这样的字符串值，而不是“真实的”collection 对象
如果您使用 ng-repeat 创建选项，那么模型将是一个字符串，要实现对象绑定您需要使用 ng-options
好的，谢谢@maurycy，所以不能像我这样混合......也许我可以添加一个selectedCollectionName变量作为ng-model并将一个函数链接到@987654339 @ 实际上根据名称计算 selectedCollection... 这是我能找到的最佳解决方案
@maurycy 你能回答你的评论吗？

标签： angularjs ng-repeat ng-options

【解决方案1】：

很遗憾，您尝试实现的目标无法实现。 ngOptions 指令负责将对象绑定到模型，任何其他方法（如 ngRepeat）会将模型设置为字符串，因此值不能是对象，并且将 ngOptions 与 html option 混合将不起作用。

您可以使用ngChange 或将案例添加到集合中并使用过滤器仅返回应显示的案例

【讨论】：