根据是否存在显示一个值或另一个值答案

【问题标题】：Show a value or another depending on if it's present根据是否存在显示一个值或另一个值
【发布时间】：2016-03-14 11:36:03
【问题描述】：

我有以下数组：

vm.persons = [{id:1, name:'Manuel1', age:30}, {id:2, name:'Manuel2', errorCode:'Error', age:18}]

而我想以这种方式展示：

------------------
|Name    | Age   |
------------------
|Manuel2 | Error |
------------------
|Manuel1 | 30    |
------------------

因此，如果存在errorCode，则不应显示年龄。

这就是我现在拥有的：

    <tr ng-repeat="person in persons" ng-class="...">
      <td>{{::person.name}}</td>
      <td>{{::person.age}}</td>
    </tr>

我该如何进行检查。我想首先展示有错误的人，然后是其余的人。我认为您可以使用 array.sort 来做到这一点，对吧？

【问题讨论】：

使用 ng-show ng-hide 阅读此scotch.io/tutorials/how-to-use-ngshow-and-nghide
见stackoverflow.com/questions/27490652/…

标签： javascript html angularjs

【解决方案1】：

<tr ng-repeat="person in persons | orderBy:'errorCode'" ng-class="...">
  <td>{{::person.name}}</td>
  <td>{{::(!person.errorCode) ? person.age : 'Error'}}</td>
</tr>

【讨论】：

谢谢！很好的答案。

【解决方案2】：

我使用指令ng-if 来实现这一点，如下所示：

<tr ng-repeat="person in persons" ng-class="...">
  <td>{{::person.name}}</td>
  <td ng-if="person.age">{{::person.age}}</td>
</tr>

ng-if 评估表达式，如果为 true 则显示元素...您可以执行 ng-if="person.errorCode != 'Error'" 或 ng-if="!person.errorCode" 之类的操作，您必须检查符合您需求的 true false 表达式...

【讨论】：

【解决方案3】：

<tr ng-repeat="person in persons" ng-class="..."> <td>{{::person.name}}</td> <td>{{person.age == 'Error' ? '-' : ::person.age}}</td> </tr>

如果您不想显示年龄，则需要显示一些文本，否则如果找不到，您的设计将运行

【讨论】：

【解决方案4】：

您应该能够使用 ?: 三元运算符，它充当简单的类似 if/then 的表达式。这将评估第一项（在？之前）。如果计算结果为真，则 ? 之后的表达式被退回。如果计算结果为 false，则返回 : 之后的表达式。

所以{{::(person.errorCode ? person.errorCode : person.age)}} 应该可以工作，虽然我还没有测试过。

【讨论】：

【解决方案5】：

使用 ng-if 打印或不打印 col 和 colspan 以防止出现空白

<tr ng-repeat="person in persons" ng-class="...">
    <td colspan="{{!person.errorCode ? '1' : '2'}}">{{::person.name}}</td>
    <td ng-if="!person.errorCode" >{{::person.age}}</td>
</tr>

【讨论】：

【解决方案6】：

试试这个 -

 <tr ng-repeat="person in persons" ng-class="...">
      <td>{{person.name}}</td>
      <td ng-if="!person.errorCode">{{person.age}}</td>
      <td ng-if="person.errorCode">{{person.errorCode}}</td>
 </tr>

【讨论】：

【解决方案7】：

使用此代码使其工作

  <tr ng-repeat="person in persons" ng-class="...">
  <td>{{person.name}}</td>
  <td>{{person.errorcode==""?person.age:person.errorcode}}</td>
  </tr>

【讨论】：

【解决方案8】：

订购请查看orderBy。

如果元素已定义，您可以定义一个自定义函数返回 1，否则返回 0。

条件显示已在多个答案中说明。

【讨论】：