[英]AngularJS display multiple values in select menu?
我有一个使用Angular 1.5.11的选择菜单:
<select ng-model="abc.user.state" name="state" ng-options="option.code as option.name for option in abc.brStateSelect.options | orderBy: 'name' track by option.code"
class="form-control" required></select>
使用json之类的
[{ "id": 11, "name": "Rondônia", "code": "RO" }, { "id": 12, "name": "Acre", "code": "AC" }]
并且菜单正确显示“名称”道具。 但是我想显示两个道具:“名称”和“代码”,例如Acre - AC
作为菜单项。
如何修改ng-options以显示多个字段作为标签?
你可以这样做,
<select ng-model="abc.user.state" name="state" ng-options="option.name as option.name + '-' + option.code for option in datas | orderBy: 'name' track by option.code" class="form-control" required></select>
演示
var app = angular.module("myApp", []); app.controller("myCtrl", function($scope) { $scope.datas = [{ "id": 11, "name": "Rondônia", "code": "RO" }, { "id": 12, "name": "Acre", "code": "AC" }]; });
<!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body ng-app="myApp" ng-controller="myCtrl"> <select ng-model="abc.user.state" name="state" ng-options="option.name as option.name + '-' + option.code for option in datas | orderBy: 'name' track by option.code" class="form-control" required></select> </body> </html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.