在Angular中使用JSON对象的默认选择选项
[英]Default Select Option Using JSON Object in Angular
问题描述
我有以下代码填充页面上的某些选择项：
<select ng-model="activity.selectedParent" ng-options="parent as parent.title for parent in parents track by parent._id"></select><br>
我想知道是否可以通过某种方式指定默认选项，以便我可以为其指定标题和ID。 例如，如果选择默认值，那么activity.selectedParent.Title = "None"和activity.selectedParent.id = 0 。 是否可以使用Angular指令以某种方式在<select>标记中指定此内容？ 否则，最有效的方法是什么？
2 个解决方案
解决方案1
1 已采纳 2016-07-08 03:53:29
如果我很好地理解了您的问题，即使选择了默认值，您也要设置一个对象，那么可以通过两种方式进行操作：
在
select标签内使用ngInit指令，如下所示：ng-init="selectedParent = { '_id': 0, 'title': 'None' };"在控制器中初始化对象：
$scope.selectedParent = { "_id": 0, "title": "None" };
编辑：
我想我现在已经拥有了您想要的：您想拥有一个默认选项，而不是一个空白选项，对吗？ 如果是这样，您可以使用unshift方法将这个元素简单地添加到您现有的数组中，因此将其放置为第一个元素，如下所示：
$scope.parents.unshift($scope.selectedParent);
这是一个片段工作：
var app = angular.module('app', []); app.controller('mainCtrl', function($scope) { $scope.parents = [ { "_id":1, "title":"first" }, { "_id":2, "title":"second" }, { "_id":3, "title":"third" }, { "_id":4, "title":"four" } ]; $scope.selectedParent = { "_id": 0, "title": "None" }; $scope.parents.unshift($scope.selectedParent); });
<!DOCTYPE html> <html ng-app="app"> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> </head> <body ng-controller="mainCtrl"> <select ng-model="selectedParent" ng-options="parent as parent.title for parent in parents track by parent._id"></select> <hr> Selected: <span ng-bind="selectedParent | json"></span> </body> </html>
解决方案2
1 2016-07-08 06:57:25
如果ng-options中使用的数组不包含您希望设置为默认值的值，那么最简单的方法是将默认值添加到数组中。
首先在控制器中设置selectedParent
$scope.selectedParent = { "_id": 0, "title": "None" };
然后将其添加到数组的第一个位置
$scope.parents.splice(0,0,$scope.selectedParent);
最后将select的ng-model设置为ng-model="$scope.selectedParent"
角度选择-带有JSON对象的选项值
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.