使用Angularjs在选择下拉菜单中设置默认值

我有一个对象，如下所示。我有显示这些作为一个下拉：使用Angularjs在选择下拉菜单中设置默认值

var list = [{id:4,name:"abc"},{id:600,name:"def"},{id:200,name:"xyz"}]

以我控制器I具有携带的值的变量。该值决定该阵列中的上述三项将默认在下拉菜单中选择：

$scope.object.setDefault = 600;

当我如下创建一个下拉形式项：

<select ng-model="object.setDefault" ng-options="r.name for r in list">

我面对两个问题：

为

<option value="0">abc</option> 
<option value="1">def</option> 
<option value="2">xyz</option>

生成列表3210

，而不是

<option value="4">abc</option> 
<option value="600">def</option> 
<option value="200">xyz</option>

无选项被默认情况下，即使我有ng-model="object.setDefault"

来源

2013-07-23 runtimeZero

在角里面选择元素 –

Ajay..you里面选择的指数期权的价值属性似乎是对的。所以现在的问题是，我如何给它一个自定义的值 – runtimeZero

当您使用NG选项来填充选择列表中选择，它采用全对象作为选定的值，而不仅仅是您在选择列表中看到的单个值。所以你的情况，你需要设置

$scope.object.setDefault = { 
    id:600, 
    name:"def" 
};

或

$scope.object.setDefault = $scope.selectItems[1];

我也建议只是在输出模板$ scope.object.setDefault的值，看看我在说什么关于选择。

<pre>{{object.setDefault}}</pre>

来源

2013-07-23 15:55:56 Sharondio

只有第二个可以工作。选择使用===来比较值。如果您使用相同的属性设置另一个对象，则会被视为不同。 –

很高兴知道。我总是自己使用第二种方法，但是想出一个相同的对象会起作用。 – Sharondio

另一个选择是使用'select as label for array in'来将模型绑定到值为 – noj

-11

，我可以帮助你的HTML：中

<option value="">abc</option>

代替

<option value="4">abc</option>

设置abc设置为默认值。

来源

2013-08-22 13:44:36

不会这样做不工作 –

问题1：

生成的HTML是正常的。显然，Angular的一个特性是能够使用任何类型的对象作为select的值。 Angular在HTML选项值和ng模型中的值之间进行映射。也看到在这个问题上Umur的评论：How do I set the value property in AngularJS' ng-options?

问题2：

确保您使用以下NG选项：

<select ng-model="object.item" ng-options="item.id as item.name for item in list" />

，并把这个在你的控制器选择默认值：

object.item = 4

来源

2014-01-03 10:35:40 Stephanie

某些场景，object.item不会被加载或将被定义。

使用NG-INIT

<select ng-init="object.item=2" ng-model="object.item" 
ng-options="item.id as item.name for item in list"

来源

2014-03-06 23:06:48

ng-options正在枚举我的列表0..10等，而不管实际的id值如何。没关系。这只是渲染。实际值将以表单提交形式传递。 – nathanengineer

在查看

<select ng-model="boxmodel"><option ng-repeat="lst in list" value="{{lst.id}}">{{lst.name}}</option></select>

JS：

在侧控制器

$scope.boxModel = 600;

来源

2014-04-04 05:50:46 Webfreaks

-3

我们应该使用名称值对绑定值到dropdown.see的代码了解更多详情

function myCtrl($scope) { 
 
    $scope.statusTaskList = [ 
 
     { name: 'Open', value: '1' }, 
 
     { name: 'In Progress', value: '2' }, 
 
     { name: 'Complete', value: '3' }, 
 
     { name: 'Deleted', value: '4' }, 
 
    ]; 
 
    $scope.atcStatusTasks = $scope.statusTaskList[0]; // 0 -> Open 
 
}

<select ng-model="atcStatusTasks" ng-options="s.name for s in statusTaskList"></select>

来源

2014-10-15 09:48:05 vinodhkumar

你的努力是好的，但解决方案不起作用 –

$scope.item = { 
    "id": "3", 
    "name": "ALL", 
}; 

$scope.CategoryLst = [ 
    { id: '1', name: 'MD' }, 
    { id: '2', name: 'CRNA' }, 
    { id: '3', name: 'ALL' }]; 

<select ng-model="item.id" ng-selected="3" ng-options="i.id as i.name for i in CategoryLst"></select>

来源

2015-01-22 14:14:22

而这个代码解决了两个OP问题中的哪一个？ – Zac

您可以（通过轨道）与下面的代码做到这一点，

<select ng-model="modelName" ng-options="data.name for data in list track by data.id" ></select>

来源

2015-02-02 10:02:57

这是一个老问题，哟你可能已经得到了答案。

我plnkr解释了我的方法来实现选择默认值下拉列表。基本上，我有一个服务，将返回下拉值[硬编码测试]。我无法选择默认值，几乎花了一天，终于想通了，我应该在的script.js文件中设置$scope.proofGroupId = "47";而不是$scope.proofGroupId = 47;。这是我的不好，我没有注意到我设置了一个整数47而不是字符串“47”。我保留了plnkr，以防万一某些人想看到。希望这会对一个人有所帮助。

来源

2015-11-24 23:50:30 user007

<select ng-init="somethingHere = options[0]" ng-model="somethingHere" ng-options="option.name for option in options"></select>

这将让你期望的结果老兄:)干杯

来源

2016-02-18 12:03:22

使用Angularjs在选择下拉菜单中设置默认值

回答

相关问题