Angularjs绑定的select的默认值

10 浏览
0 Comments

Angularjs绑定的select的默认值

在Angular教程中，他们设置了一个sortOrder作用域变量，默认将选择排序设置为“最新”。

在我的fiddle中，我做了类似的操作，但是我的选择值没有被选中。相反，我得到了空白的条目，就像我没有在作用域中设置任何值一样。然而，我可以看到我的排序顺序，并且我正在发出选择的值，并且它是预设的。

我知道我可以使用ng-init来设置默认值，但是我也希望能以这种方式来设置。

有什么建议吗？

0

1 答案

0 Comments

AngularJS绑定选择的默认值是一个常见的问题。出现这个问题的原因是，当使用数组对象作为选择项时，无法直接设置默认值。解决方法是将选择项定义为一个对象，然后通过字符串引用来设置默认值。

首先，将选择项定义为一个对象，其中每个属性都是选择项的键值对。例如：

$scope.eventFilters = {
    "OPEN": "All Open Events",
    "UNMAPPED": "All Un-Mapped Events",
    "MAPPED": "All Mapped Events",
    "CLOSED": "All Closed Events (past 8 hours)",
    "ALL": "All Events",
    "OTHER": "Other OpCenter Open Events"
};

然后，将默认值设置为选择项对象中的一个键（字符串）：

$scope.ddlFilter = "MAPPED";

接下来，在页面上更新选择框的定义：

<select ng-model="ddlFilter" ng-options="k as v for (k, v) in eventFilters"></select>

此时，过滤器不再需要使用.value，所以过滤器的定义将变为：

<tr ng:repeat="event in events | myEventFilter:ddlFilter | orderBy:sort.column:sort.descending">

你可以在这里查看修改后的代码的工作示例：http://jsfiddle.net/WXLte/2/

然后，有人提出了一个相关的问题，即如何将动态获取的选项与现有选项合并。解决方法是使用angular.extend方法，它可以将新的属性合并到当前对象中。类似于jQuery的方法。

有人建议提出一个新的问题，更具体地解释这个新问题，并提供链接到这个问题的引用，这样可以获得更多人的帮助。

0