在 ng-repeat 语句中使用或条件答案

【问题标题】：Using Or Condition in ng-repeat statement在 ng-repeat 语句中使用或条件
【发布时间】：2019-07-23 20:45:15
【问题描述】：

如何在 ng-repeat 中使用 Or 条件。我目前有

<div ng-repeat="waterSample in viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE">

有时可以是 viewRequest.data.REV_SAMPLE_CMQREQUEST。它应该寻找viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE or viewRequest.data.REV_SAMPLE_CMQREQUEST 我该如何解决这个问题

【问题讨论】：

您使用什么条件来决定是否显示一个与另一个？仅仅是一个属性为空/false/null 的问题，而另一个属性实际上会有一个值吗？
可能重复stackoverflow.com/questions/18056241/…
@YellowShark 我需要检查 viewRequest.data 是否有 REV_SAMPLE_CMQREQUEST_WATER_SAMPLE 然后迭代它，否则其他
建议的副本不适用。重复是关于过滤集合，而不是在两个集合之间进行选择。

标签： angularjs angularjs-ng-repeat

【解决方案1】：

为了达到预期的效果，请使用以下三元条件检查 viewRequest.data 中的 REV_SAMPLE_CMQREQUEST_WATER_SAMPLE 属性，并根据条件使用 REV_SAMPLE_CMQREQUEST_WATER_SAMPLE 或 REV_SAMPLE_CMQREQUEST

     <div ng-repeat="waterSample in viewRequest.data.hasOwnProperty('REV_SAMPLE_CMQREQUEST_WATER_SAMPLE')? viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE : viewRequest.data.REV_SAMPLE_CMQREQUEST">
{{wareSample}}
      </div>

工作代码示例

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $scope.viewRequest = {
    data: {
      REV_SAMPLE_CMQREQUEST_WATER_SAMPLE : [
        {id: 1, name: "test1"},
        {id: 2, name: "test2"}
      ],
      REV_SAMPLE_CMQREQUEST:[
        {id: 100, name: "ABC1"},
        {id: 200, name: "ABC2"}
      ]
    }
  }
  
  $scope.conditionalArr = $scope.viewRequest.data.hasOwnProperty('REV_SAMPLE_CMQREQUEST_WATER_SAMPLE')? $scope.viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE : $scope.viewRequest.data.REV_SAMPLE_CMQREQUEST
});

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

<div ng-app="myApp" ng-controller="myCtrl"> 

  <div ng-repeat="waterSample in viewRequest.data.hasOwnProperty('REV_SAMPLE_CMQREQUEST_WATER_SAMPLE')? viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE : viewRequest.data.REV_SAMPLE_CMQREQUEST">
    {{waterSample.id}} {{waterSample.name}}
  </div>

</div>



</body>

codepen - https://codepen.io/nagasai/pen/GVZRem?editors=1010

【讨论】：

【解决方案2】：

一种方法是使用ng-show，如下所示：

<div ng-show="viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE" 
    ng-repeat="waterSample in viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE">
<div ng-show="!viewRequest.data.REV_SAMPLE_CMQREQUEST_WATER_SAMPLE" 
    ng-repeat="waterSample in viewRequest.data.REV_SAMPLE_CMQREQUEST">

【讨论】：

【解决方案3】：

我认为更简单、更简洁的方法是在控制器中连接这两个数组，然后在 ng-repeat 中使用它。

【讨论】：