Question

我一直在尝试为angularJS设置默认的预选选项，出于某些原因我不能这样做。这是link to the relevant Plunkr。

以下是相关代码：

<select 
      ng-model="selectedOption" 
      ng-options="option.value as option.name for option in options">
    </select>

我尝试过ng-init和一些不同的方法;我无法确定如何将顶部选项作为预选选项。

Answer 1

linked回答建议使用ng-init。我会在控制器或指令的selectedOption函数中为link分配默认选项：

$scope.selectedOption = options[0]

我认为不需要为这个简单的任务使用另一个指令。

Answer 2

如果你想要的是设置options中预先定义的选项之一，在ng-init中执行this $scope.selectedOption = <value>之类的操作，其中<value>是您要在默认情况下标记为已选中的对象的value属性。例如1，如果您options中的第一个对象是{value: 1, name: "Option Number 1}。请参阅以下代码：

$scope.options = [{value:1, name: "Option 1"}, {value:2, name: "Options 2"}];

$scope.selectedOption = 1;

另一方面，如果您只想显示预定义选项，指示用户选择一个选项（而不是options中的某个选项）... 这是一种非常简单（但有效的方法）。请参阅以下代码：

<select
    ng-model="selectedOption"
    ng-options="option.value as option.name for option in options">
    <option value="">--Default--</option>
</select>

Answer 3

只需更新元素的模型，即selectedOption='yourDefaultValue'

你使用的角度是多少？如果是最新的，那么你可以使用下面的代码::

    <select 
      ng-model="selectedOption" [ng-value]='yourDefaultValue'`
      ng-options="option.value as option.name for option in options">
    </select>

Answer 4

链接到更新的plunkr：http://plnkr.co/edit/SkS0NqyXpnMcddu80anf?p=preview

如angular doc

中所述，应该避免更新在函数中移动的模型代码以及track by和Be careful when using select as and track by in the same expression.

userData

如何使用AngularJS设置select的默认选项？

4 个答案: