在angular中使用ng-repeat将selected应用到最后一个选项

apply selected to last option with ng-repeat in angular

本文关键字：应用 selected 最后一个 选项 ng-repeat angular      更新时间：2023-09-26

我如何将selected属性应用于AngularJS中与ng-repeat插入的最后一个选项?我像这样插入HTML:

<select class="form-control half" ng-model="selectValue">
    <option></option>
    <option data-ng-repeat="mf in SearchCtrl.manifacturers | orderBy: SearchCtrl.manifacturers">
        {{ mf }}
    </option>
</select>

现在我知道关于data-ng-attr-selected="$last && selected || none"，但关于选择的问题是，它不依赖于一个属性的值，而只是插入属性本身。

所以我的问题是，是否有可能将属性应用于数组中的最后一个元素。

还有一个侧面问题:是否可以将selected应用于数组之前的第一个空选项，如果没有结果返回到数组?

对不起，如果问题不清楚，如果是，问走，我会尽量简化，感谢阅读!

首先，在大多数情况下，在angular中创建<select>时，最简单的方法是像这样使用ngOptions，它会为你创建选项，并处理添加和删除:

<select ng-model="yourModel" ng-options="element for element in array"></select>

ngOptions的链接有更多的自定义方法来控制选项中显示的内容以及当你选择其中一个选项时传递给模型的数据。

现在，回到你的问题:

传递给ng-model的变量是双向绑定，因此通过更改模型，它将在选项上设置selected属性，其值与模型匹配。如果你在控制器中这样做，它会将其设置为第一个选项:

selectValue = SearchCtrl.manifacturers[0];

对于最后一个你可以直接写

selectValue = SearchCtrl.manifacturers[SearchCtrl.manifacturers.length - 1];

同样，如果数组为空，则只会选择一个空选项。现在，如果你想让它更容易被重用，它只会根据一些表达式选择第一个或最后一个选项，你可以为它创建一个指令。如果这不是你想问的，请澄清。

相关文章：