关于HTML标记的Angularjs三元语句

Question

 <h4 class="changecolor">{{driver.name}}&nbsp;</h4>
<h4 class="changecolor" ng-show="!driver.name">{{driver.officeEmail}}&nbsp;</h4>

如果driver.name不可用，请显示driver.officeEmail

有没有办法在一行中使用三元语句来实现它？

Answer 1

如果您只想使用一个绑定，请尝试：

<h4 class="changecolor">{{driver.name || driver.officeEmail}}</h4>

这称为short-circuit evaluation。如果driver.name未定义，则会显示driver.officeEmail。

Answer 2

@quantumwannabe的回答是有效的，并且对于这个特定的用例是一个更好的解决方案，但是OP询问了从版本1.2.x开始也可能的三元。

angular.module("app", [])
  .controller('appCtrl', ['$scope',
    function($scope) {
      $scope.driver = {email : "test"};
    }
  ]);

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

<div ng-app="app">
  <div ng-controller="appCtrl">
    <h4 class="changecolor">{{driver.name ? driver.name : driver.email}}</h4>
  </div>
</div>

Answer 3

<h4 class="changecolor">{{(driver.name) ? driver.name : driver.officeEmail}}&nbsp;</h4>

这对我有用。