Angular JS Break ForEach


256

我有一个角度foreach循环,如果我匹配一个值,我想摆脱循环。以下代码不起作用。

angular.forEach([0,1,2], function(count){
  if(count == 1){
    break;
  }
});

我怎么能得到这个?


1
我不明白为什么您不只是查找值而不是进入循环。也许您所举的例子并没有讲完整的故事,但我宁愿做@Aman下面说的话。为什么要进入如下所述的循环并在每次some()以一种更优雅的方式精确地执行此操作时都进行检查。请记住,如果您将javascript视为一种功能语言,那么使用这些for / while / break类型的控制结构应该毫无意义。这就是为什么存在foreach,发现,有些等等的原因
Adrian Rodriguez

Answers:


264

没有办法做到这一点。见https://github.com/angular/angular.js/issues/263。根据您正在执行的操作,可以使用布尔值来不进入循环的主体。就像是:

var keepGoing = true;
angular.forEach([0,1,2], function(count){
  if(keepGoing) {
    if(count == 1){
      keepGoing = false;
    }
  }
});

45
我宁愿只是!keepGoing && return;在函数顶部添加一个,减少代码。
安德鲁·乔斯林

46
这不是最佳实践,在这里angular forEach循环永远不会中断,并且没有什么可以破坏angular.forEach的。原生for循环比angular.forEach快90%。因此,当您想中断条件匹配时,最好使用native for循环。谢谢
Nishchit Dhanani 2014年

xcatly我停留在哪里...这有所帮助..感谢一吨...无论如何我想知道使forEach循环不可中断的原因。如果有的话
Saurabh Tiwari 2015年

这不应被接受,因为它不会中断forEach循环。这是一种不在循环内执行所有逻辑的方法。
星云

296

angular.forEach循环不能在条件匹配打破。

我的个人建议是使用NATIVE FOR循环而不是angular.forEach

NATIVE FOR循环比其他for循环快90%

对于循环中断,对于循环测试结果

在语言中使用FOR循环:

var numbers = [0, 1, 2, 3, 4, 5];

for (var i = 0, len = numbers.length; i < len; i++) {
  if (numbers[i] === 1) {
    console.log('Loop is going to break.'); 
    break;
  }
  console.log('Loop will continue.');
}

1
这对我不起作用。它所做的只是完成循环的此特定迭代。但随后进入下一个迭代。

1
@Ben,对不起,Ben,这是我的错误,但经过长时间的研究后,我现在更新了答案。我希望这能帮到您 。谢谢
Nishchit Dhanani 2014年

1
@LGama:-你的情况是什么??
Nishchit Dhanani 2014年

3
jsperf.com/angular-foreach-performance在您自己的浏览器上对其进行测试,以确定应该选择哪个功能。我已经在IE11上进行了测试,它的速度也与屏幕截图一样快。还测试了Array.some(),但它比IE11上的Array.forEach()慢,但可能比angular.foreach ;-)快。或在此处进行测试jsperf.com/angular-foreach-vs-native(所有学分归原始作者所有,而非我本人;
塞巴斯蒂安

6
即使使用jsperf,您也不能说“ native for快了90%”。在您的方案中,这很大程度上取决于内部函数的执行成本以及通过提早退出循环(中断)可以保存多少次执行。
hgoebl

22

请使用ForEach的部分或每个实例,

Array.prototype.some:
some is much the same as forEach but it break when the callback returns true

Array.prototype.every:
every is almost identical to some except it's expecting false to break the loop.

一些示例:

var ary = ["JavaScript", "Java", "CoffeeScript", "TypeScript"];

ary.some(function (value, index, _ary) {
    console.log(index + ": " + value);
    return value === "JavaScript";
});

每个示例:

var ary = ["JavaScript", "Java", "CoffeeScript", "TypeScript"];

ary.every(function(value, index, _ary) {
    console.log(index + ": " + value);
    return value.indexOf("Script") > -1;
});

查找更多信息
http://www.jsnoob.com/2013/11/26/how-to-break-the-foreach/


否@ AngelS.Moreno,每个人都喜欢使用局部变量而不是专门为具体情况设计的方法
Oded Niv

18

使用数组某种方法

 var exists = [0,1,2].some(function(count){
      return count == 1
 });

存在将返回true,您可以将其用作函数中的变量

if(exists){
    console.log('this is true!')
}

数组某种方法-Javascript


4
对我而言,使用的唯一原因angular.forEach()是我必须支持IE8,而后者没有Array.forEach()...或Array.some()
Bennett McElwee 2014年

2
您可以轻松地填充Array.forEach。见页的底部:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
zumalifeguard

6

据我所知,Angular没有提供这样的功能。您可能需要为此使用下划线find()功能(基本上是forEach,一旦该函数返回true,它就会退出循环)。

http://underscorejs.org/#find


这可能会从侧面解决问题,但实际上并没有打破循环。
Elise Chant 2015年

还是本地循环的
尚蒂

6

如果将jQuery(因此不是jqLit​​e)与AngularJS结合使用,则可以使用$ .each进行迭代-允许基于布尔返回值表达式进行中断和继续。

JSFiddle:

http://jsfiddle.net/JEcD2/1/

Javascript:

var array = ['foo', 'bar', 'yay'];
$.each(array, function(index, element){
    if (element === 'foo') {
        return true; // continue
    }
    console.log(this);
    if (element === 'bar') {
        return false; // break
    }
});

注意:

尽管使用jQuery还不错,但是MDN推荐使用本机Array.someArray.every函数,您可以在本机forEach文档中阅读:

“无法停止或中断forEach循环。解决方案是使用Array.every或Array.some”

MDN提供了以下示例:

Array.some:

function isBigEnough(element, index, array){
    return (element >= 10);
}
var passed = [2, 5, 8, 1, 4].some(isBigEnough);
// passed is false
passed = [12, 5, 8, 1, 4].some(isBigEnough);
// passed is true

Array.Every:

function isBigEnough(element, index, array){
    return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true

6

具体来说,您可以退出forEach循环,并且可以在任何地方引发异常。

try {
   angular.forEach([1,2,3], function(num) {
      if (num === 2) throw Error();
   });
} catch(e) {
    // anything
}

但是,最好使用其他库或实现自己的find函数(在这种情况下为函数),因此代码是最高级的。


10
好吧,您确实回答了这个问题!我希望没有人这样做:)
Jason Cox

不必要地引发异常不是处理这种情况的好方法。而是检查@ dnc253 stackoverflow.com/a/13844508/698127
Aamol,2017年

4

试试这个作为休息;

angular.forEach([0,1,2], function(count){
  if(count == 1){
    return true;
  }
});

3

正如其他答案所述,Angular不提供此功能。jQuery可以,但是如果您已经加载了jQuery和Angular,则可以使用

jQuery.each ( array, function ( index, value) {
    if(condition) return false; // this will cause a break in the iteration
})

参见http://api.jquery.com/jquery.each/


2
OP要求使用AngularJS解决方案,正确答案为否:)
Shannon Hochkins 2015年

3

通常,没有办法打破javascript中的“每个”循环。通常可以使用“短路”方法。

    array.forEach(function(item) {
      // if the condition is not met, move on to the next round of iteration.
      if (!condition) return;

      // if the condition is met, do your logic here
      console.log('do stuff.')
    }


2

break 无法实现有角度的forEach,我们需要修改forEach才能做到。

$scope.myuser = [{name: "Ravi"}, {name: "Bhushan"}, {name: "Thakur"}];  
                angular.forEach($scope.myuser, function(name){
                  if(name == "Bhushan") {
                    alert(name);
                    return forEach.break(); 
                    //break() is a function that returns an immutable object,e.g. an empty string
                  }
                });

这个答案似乎并不完整。请指出是否break()需要定义,或者是否已经是角度的一部分。请定义是否。
geoidesic's

2

您可以使用此:

var count = 0;
var arr = [0,1,2];
for(var i in arr){
   if(count == 1) break;
   //console.log(arr[i]);
}

1
var ary = ["JavaScript", "Java", "CoffeeScript", "TypeScript"];
var keepGoing = true;
ary.forEach(function(value, index, _ary) {
    console.log(index)
    keepGoing = true;
    ary.forEach(function(value, index, _ary) {
        if(keepGoing){ 
            if(index==2){
                keepGoing=false;
            }
            else{
                console.log(value)
            }

        }      
    });
});

0
$scope.arr = [0, 1, 2];  
$scope.dict = {}
for ( var i=0; i < $scope.arr.length; i++ ) {
    if ( $scope.arr[i] == 1 ) {
        $scope.exists = 'yes, 1 exists';
        break;
    }
 }
 if ( $scope.exists ) {
     angular.forEach ( $scope.arr, function ( value, index ) {
                      $scope.dict[index] = value;
     });
 }

0

我宁愿通过返回来做到这一点。将循环部分放入私有函数中,并在需要中断循环时返回。


0

我意识到这很老了,但是数组过滤器可以满足您的需求:

var arr = [0, 1, 2].filter(function (count) {
    return count < 1;
});

然后可以运行arr.forEach和其他数组函数。

我意识到,如果您打算完全减少循环操作,那么这可能不会做您想要的。为此,您最好使用while



0

使用Return中断循环。

angular.forEach([0,1,2], function(count){
  if(count == 1) {
    return;
  }
});

0
onSelectionChanged(event) {
    let selectdata = event['api']['immutableService']['gridOptionsWrapper']['gridOptions']['rowData'];
    let selected_flag = 0;

    selectdata.forEach(data => {
      if (data.selected == true) {
        selected_flag = 1;
      }
    });

    if (selected_flag == 1) {
      this.showForms = true;
    } else {
      this.showForms = false;
    }
}

-1

我会用return代替break

angular.forEach([0,1,2], function(count){
  if(count == 1){
    return;
  }
});

奇迹般有效。


这不是有效的解决方案。外观:function test(){angular.forEach([1,2,3,4,5,6,7,8,9],function(value,index){if(value == 2)return; console.log (value);})}输出:> teste(); 1 3 4 5 6 7 8 9
otaviodecampos

-2

只需添加$ index并执行以下操作:

angular.forEach([0,1,2], function(count, $index) {
     if($index !== 1) {
          // do stuff
     }
}

OP希望打破循环。
天使S.莫雷诺
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.