angularjs中的foreach循环

Question

我本来打算通过forEach loop在AngularJS。有几点我不了解。

1. 迭代器函数的用途是什么？没有它，还有什么办法吗？
2. 如下所示，键和值的意义是什么？

angular.forEach($scope.data, function(value, key){});

PS： 我试图在不带参数的情况下运行此函数，但它不起作用。

这是我的json：

[
   {
     "Name": "Thomas",
     "Password": "thomasTheKing"
   },
   {
     "Name": "Linda",
     "Password": "lindatheQueen"
   }
]

我的JavaScript档案：

var app = angular.module('testModule', []);

app.controller('testController', function($scope, $http){
   $http.get('Data/info.json').then(
      function(data){
         $scope.data = data;
      }
   );

   angular.forEach($scope.data, function(value, key){
      if(value.Password == "thomasTheKing")
         console.log("username is thomas");
   });
});

另一个问题 ：如果在控制台中出现条件并显示“ username is thomas”，为什么上面的功能没有打开？

Answer 1

问题1和2

因此，基本上，第一个参数是要迭代的对象。它可以是数组或对象。如果它是这样的对象：

var values = {name: 'misko', gender: 'male'};

Angular将一个一个地取每个值，第一个是名称，第二个是性别。

如果要迭代的对象是数组（也是可能的），则如下所示：

[{ "Name" : "Thomas", "Password" : "thomasTheKing" },
 { "Name" : "Linda", "Password" : "lindatheQueen" }]

Angular.forEach将首先从第一个对象开始，然后是第二个对象。

对于此对象中的每个对象，都将一个接一个地对待它们，并对每个值执行特定的代码。此代码称为 迭代器函数
。如果您使用集合的数组，则forEach很聪明，并且行为也有所不同。这是一个例子：

var obj = {name: 'misko', gender: 'male'};
var log = [];
angular.forEach(obj, function(value, key) {
  console.log(key + ': ' + value);
});
// it will log two iteration like this
// name: misko
// gender: male

所以key是您的键的字符串值，而value是…的值。您可以像这样使用键来访问您的值：obj['name'] = 'John'

如果这一次您显示一个数组，如下所示：

var values = [{ "Name" : "Thomas", "Password" : "thomasTheKing" },
           { "Name" : "Linda", "Password" : "lindatheQueen" }];
angular.forEach(values, function(value, key){
     console.log(key + ': ' + value);
});
// it will log two iteration like this
// 0: [object Object]
// 1: [object Object]

因此，值是您的对象（集合），键是数组的索引，因为：

[{ "Name" : "Thomas", "Password" : "thomasTheKing" },
 { "Name" : "Linda", "Password" : "lindatheQueen" }]
// is equal to
{0: { "Name" : "Thomas", "Password" : "thomasTheKing" },
 1: { "Name" : "Linda", "Password" : "lindatheQueen" }}

希望它能回答您的问题。这是一个JSFiddle，用于运行一些代码并测试是否需要： http

//jsfiddle.net/ygahqdge/

调试代码

问题似乎来自$http.get()一个异步请求。

您向儿子发送查询， 然后 在浏览器结束下载时发送成功。 但是
在发送请求后，您angular.forEach无需等待JSON的回答就可以执行循环。

您需要在成功函数中包含循环

var app = angular.module('testModule', [])
    .controller('testController', ['$scope', '$http', function($scope, $http){
    $http.get('Data/info.json').then(function(data){
         $scope.data = data;

         angular.forEach($scope.data, function(value, key){
         if(value.Password == "thomasTheKing")
           console.log("username is thomas");
         });
    });

});

这应该工作。

更深入

在$ HTTP
API是基于延迟/承诺的API由$
Q服务公开。虽然对于简单的使用模式而言，这并不重要，但对于高级用法，熟悉这些API及其提供的保证很重要。

您可以看一下延迟/承诺API，这是Angular进行平滑异步操作的重要概念。