Angular JS - 根据下拉列表的布尔值显示选择选项

时间:2016-12-13 03:14:25

标签: angularjs

我们可以使用Angular JS

在下拉列表的选项中显示别名

问题:

尝试将更改布尔值true设置为Ascending,将false设置为显示下拉选项,并尝试在选择别名时保留布尔值 - 升序或降序

HTML:

<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
Trying to show dropdown options Ascending or Descending instead of true or false<br><br>
<select ng-model="selectedName" ng-options="x.ascending for x in names">
</select><br><br>
{{selectedName}}
</div>



</body>
</html>

JS:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.names = [{"name":"xxxx","ascending":true},{"name":"yyyy","ascending":false}];
});

http://codepen.io/nagasai/pen/ZBMLep

1 个答案:

答案 0 :(得分:1)

如果您希望显示升序/降序而不是 true / false ,那么您只需添加一个三元条件,如下所示。

<select ng-model="selectedName" ng-options="(x.ascending  ? 'Ascending' : 'Descending') for x in names track by x.ascending"></select>