个人中心
gpt4 book ai didi

javascript - AngularJS 在选择菜单中显示多个值？

转载 作者：行者123 更新时间：2023-12-03 04:33:22 25 4
gpt4 key购买 nike

我有一个使用 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": "朗多尼亚", "code": "RO"}, { "id": 12, "name": "Acre", "code": “AC”}]

并且菜单正确显示“name” Prop 。但是我想显示两个 Prop :“名称”和“代码”，例如 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>

关于javascript - AngularJS 在选择菜单中显示多个值？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43398789/

25 4 0
文章推荐： javascript - Visual Studio Code JavaScript Intellisense 不适用于对象属性
文章推荐： javascript - 这种做法叫什么？ `objectName && objectName.thing`
文章推荐： javascript - 连续将 Aframe 相机移动到视野方向
文章推荐： javascript - 有没有办法从 c3 data.columns 获取数据名称？