【问题标题】:Angular JS - display select option based on boolean value of dropdownAngular JS - 根据下拉列表的布尔值显示选择选项
【发布时间】:2016-12-13 03:14:25
【问题描述】:

我们可以使用 Angular JS 在下拉列表的选择选项中显示别名吗

问题:

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

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

【问题讨论】:

  • 不,我想看升序和降序,而不是真假
  • 我正在尝试看看是否有任何方法,我们可以将布尔值别名为升序和降序,同时希望在不修改对象和使用另一个临时对象的情况下使用相同的布尔值

标签: angularjs


【解决方案1】:

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

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

【讨论】:

  • 这将显示 xxxx 和 yyyy ,而不是升序和降序。我希望下拉选项为“升序”和“降序”
  • 我已经更新了我的代码,请试试这个。我希望它对你有用
  • 修改对象并添加额外的别名参数可能不是解决方案
  • 纯代码的“试试这个”答案是最糟糕的。请说明您在做什么以及它如何解决问题。
猜你喜欢
  • 1970-01-01
  • 2019-07-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多