在angularjs foreach循环 [英] foreach loop in angularjs
问题描述
我要通过的forEach 循环在 AngularJS 。还有，我不知道这件事几点。
I was going through the forEach loop in AngularJS. There are few points that I did not understood about it.
- 有什么用迭代函数？有没有什么办法去没有它？
- 什么是键和值的意义如下图所示？
angular.forEach（$ scope.data，功能（值，键）{}）;
PS：我想没有参数运行该功能，也没有工作。
PS: I tried to run this function without the arguments and it did not work.
下面是我的 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");
});
});
另一个问题：为什么上面的函数不进入。如果条件并打印用户名是托马斯在控制台
Another question: Why the function above does not enter on if condition and print "username is thomas" in the console?
推荐答案
所以基本上，第一个参数是迭代的对象。它可以是一个数组或一个对象。如果它是一个对象是这样的：
Questions 1 & 2
So basically, first parameter is the object to iterate on. It can be an array or an object. If it is an object like this :
var values = {name: 'misko', gender: 'male'};
角将由一个，第一个是名取每个值之一，其次是性别。
Angular will take each value one by one the first one is name, the second is gender.
如果你的对象迭代上是一个数组（也可以），就像这样：
If your object to iterate on is an array (also possible), like this :
[{ "Name" : "Thomas", "Password" : "thomasTheKing" },
{ "Name" : "Linda", "Password" : "lindatheQueen" }]
Angular.forEach将采取逐个起点由第一对象，然后是第二对象
Angular.forEach will take one by one starting by the first object, then the second object.
对于每一个此对象的，它会因此采取逐一和执行特定code为每个值。这code被称为迭代函数。的forEach很聪明，行为不同，如果你使用的是一个集合的数组。下面是一些为例：
For each of this object, it will so take them one by one and execute a specific code for each value. This code is called the iterator function. forEach is smart and behave differently if you are using an array of a collection. Here is some exemple :
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
所以，关键是你的关键的字符串值和值是...的值。您可以使用密钥来访问你这样的值： OBJ ['名'] ='约翰'
如果这个时候你显示一个数组，像这样：
If this time you display an array, like this :
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]
于是值是你的对象（集合），并且关键是你的数组的索引，因为：
So then value is your object (collection), and key is the index of your array since :
[{ "Name" : "Thomas", "Password" : "thomasTheKing" },
{ "Name" : "Linda", "Password" : "lindatheQueen" }]
// is equal to
{0: { "Name" : "Thomas", "Password" : "thomasTheKing" },
1: { "Name" : "Linda", "Password" : "lindatheQueen" }}
我希望这回答你的问题。这里是一个的jsfiddle运行一些code和测试，如果你想： http://jsfiddle.net/ygahqdge/
问题似乎来自一个事实 $ http.get（）是一个异步请求。
The problem seems to come from the fact $http.get() is an asynchronous request.
您在您的儿子发送一个查询，，然后当你的浏览器最后下载它，它执行成功。 BUT 只是发送请求您的使用执行一个循环之后 angular.forEach 无需等待您的JSON的答案。
You send a query on your son, THEN when you browser end downloading it it execute success. BUT just after sending your request your perform a loop using angular.forEach without waiting the answer of your JSON.
您需要在成功的功能循环
You need to include the loop in the success function
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");
});
});
});
这应该工作。
href=\"https://docs.angularjs.org/api/ng/service/$http#!\"> $ HTTP API 基于的deferred/promise的API 通过在$ q曝光
服务。虽然简单的使用模式，这并不多，因为事
高级用法来熟悉这些API是很重要的
和保证他们提供的。
The $http API is based on the deferred/promise APIs exposed by the $q service. While for simple usage patterns this doesn't matter much, for advanced usage it is important to familiarize yourself with these APIs and the guarantees they provide.
您可以给看看递延/许的API ，它是角度的一个重要概念使流畅的并行操作。
You can give a look at deferred/promise APIs, it is an important concept of Angular to make smooth parallel actions.
这篇关于在angularjs foreach循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
