将选定内容应用于最后一个选项,并使用角度为

时间:2015-10-05 21:45:12

标签: javascript html angularjs

如何将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应用于数组之前的第一个 - 空选项,如果没有结果返回到数组?

对不起,如果问题不清楚,如果是,请求离开,我会尽量简化,感谢阅读!

1 个答案:

答案 0 :(得分:1)

首先,在大多数情况下,在角度中创建<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];

此外,如果数组为空,则只会选择一个空选项。现在,如果你希望这是一个更可重用的东西,只需根据某个表达式选择第一个或最后一个选项,你就可以为它做一个指令。如果这不是您要求的,请澄清。