将两个附加选项添加到带有ngOptions的选择列表

Question

我有一堆选择列表，我正在尝试向它们添加“无”和标题选项。代码如下所示：

<select ng-options="value.name for value in values" ng-model="selection">
    <option value="" disabled>{{title}}</option>
    <option value="">None</option>
</select>

目前，我无法将它们添加到数据中，因此我试图找到一种方法来使其正常工作。当我第一次加载它们时，“
none”选项不存在。标题在那里并且可以按预期工作，但是似乎我无法在此选择列表中添加两个空白条目。

最简单的方法是将“ none”选项添加到数据中，但这对我来说是不可能的。有没有实现我想要的正确方法？

Answer 1

没错，您只能有一个硬编码元素。<option ng- repeat>从技术上讲可以做到这一点，但是该方法仅明确支持绑定到字符串，因此在执行操作时绑定对象很费力。

您说不能将“ None”添加到数据中，但是可以做第二件事：使用过滤器将其添加到正在迭代的ng-options数组中：

app.filter('addNone', function () {
    return function(input) {
        var newArray = input.slice(0); //clone the array, or you'll end up with a new "None" option added to your "values" array on every digest cycle.
        newArray.unshift({ name: "None" });
        return newArray;
    };
})

然后使用以下过滤器：

 <select class="form-control" ng-options="value.name as value.name for value in filter.values | addNone" ng-model="filter.selected" ng-change="goSearch()">
                    <option value="" disabled>{{filter.name}}</option>
                </select>