Javascript AngularJS-如果有大量值，则为ng

大家好

我希望div仅在满足未知（可能很大）数量的条件时显示。比如：

<div ng-if="foreach(arrayOfValues as row) row.username != ''"> nice data</div>

nice数据

因此，只要数据被正确填充并且所有数据都被接收（来自多个源），数据块就会立即出现

---

谢谢你

只需在控制器中执行即可：

.controller('myController', function($scope){

   $scope.isValid = function(){
      for(var i = 0; i < $scope.arrayOfValues.length; i++){
          if($scope.arrayOfValues.username == '') return false
      }
      return true;
   })  

})

您可以使用every（）方法，并传递一个在您的作用域中定义的简单checker函数，如下所示

<div ng-if="arrayOfValues.every(checkValues)"> nice data</div>

这将返回一个真实或虚假的值。空字符串是虚假的，因此任何具有名称的内容都将返回真实值。在这种情况下，返回元素就足够了

这是一个可以工作的提琴，有一个按钮可以更新名字来显示文本

---

我不明白您为什么要在html模板中执行此操作。它可以作为一个简单的js函数来完成，该函数将返回所有good的true或break并返回false。将更加优化和更好。请不要污染你的html。我不想在视图中这样做，这只是为了设定目标，真的：）这就是我所想的。可悲的是，我不能使用$q.all，因为我并没有真正履行承诺（正如我所了解的，使用现有服务并不总是一件好事！）。希望有更好的事情做的原因比使用一个观察者。。。无论如何，谢谢你的帮助！如果没有更好的答案，我将对此进行验证。您是否可以使用

$q

创建自己的承诺，并在回调中解析您可以访问的任何内容？不完全是，这是一个扩展工厂，来自一个服务，我无法对其进行更改以返回数据。。。在扩展工厂中，每个元素都是单独处理的。下面我得到了一个很好的答案！有关手表解决方案，请参见我的编辑2。假设您不能直接连接到承诺中来监视负载状态，这是我所知道的最有效的方法。只是一个小的调整，暂停一下将使其速度大大加快。这看起来棒极了！我试过了，效果很好。因为我还年轻，有棱角，这会对表演造成多大的伤害？如果我想在等待时显示加载程序，我可以使用加载还是会对性能造成更大的影响？这和我的

isInvalid

解决方案一样低效。它（和我的）效率很低，因为每次angular启动一个摘要循环（使DOM使用新的范围值进行实时更新的事情），它都必须执行扫描以查看返回值是否已更改，从而查看是否有一个新的值来更新DOM。如果您使用

$watch

并在知道手表已加载后销毁手表，则无需重新检查。当然，一个问题是否足以保证采取不同的方法是主观的。

不会影响性能。从我看到的console.log中，它每秒会触发多次！！没那么好，你终于可以做到了，是的。就性能而言。。。这取决于集合的大小，以及在计算true/false的函数中有多少逻辑。这样做的好处是，您只需返回元素，这使得它非常精简。老实说，如果集合的大小相当大，如果您经常切换，那么使用ng show/hide可能是一种更好的方法。ng if完全从DOM中删除元素，并且在创建后必须重新创建该元素的作用域。
.controller('myController', function($scope){
   $scope.loaded = false;

   var clearWatch = $scope.$watch('arrayOfValues', function(){
      $scope.loaded = true
      for(var i = 0; i < $scope.arrayOfValues.length; i++){
          if($scope.arrayOfValues.username == ''){
              $scope.loaded = false;
              break;
          }
      }
      if($scope.loaded){
         clearWatch();
      }
   }, true)

})

<div ng-if="arrayOfValues.every(checkValues)"> nice data</div>

$scope.checkValues = function(element) { return element; }