Eu estava atravessando o forEach
loop
no AngularJS
. Existem alguns pontos que eu não entendi sobre isso.
- Qual é o uso da função iteradora? Existe alguma maneira de ir sem ele?
- Qual é o significado da chave e do valor conforme mostrado abaixo?
angular.forEach($scope.data, function(value, key){});
PS: Tentei executar esta função sem os argumentos e não funcionou.
Aqui está o meu json
:
[
{
"Name": "Thomas",
"Password": "thomasTheKing"
},
{
"Name": "Linda",
"Password": "lindatheQueen"
}
]
Meu JavaScript
arquivo:
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");
});
});
Outra pergunta : Por que a função acima não entra em condição e imprime "nome de usuário é thomas" no console?
success
que aconteça de sua$http.get()
, assim, quandoangular.forEach()
acontece,$scope.data
ainda está indefinido.Respostas:
Perguntas 1 e 2
Então, basicamente, o primeiro parâmetro é o objeto para iterar. Pode ser uma matriz ou um objeto. Se for um objeto como este:
Angular pegará cada valor um por um, o primeiro é o nome, o segundo é o gênero.
Se o seu objeto para iterar for uma matriz (também possível), assim:
Angular.forEach pegará um por um, começando pelo primeiro objeto e, em seguida, pelo segundo objeto.
Para cada um deste objeto, ele os pegará um por um e executará um código específico para cada valor. Esse código é chamado de função iteradora . forEach é inteligente e se comporta de maneira diferente se você estiver usando um array de uma coleção. Aqui está algum exemplo:
Portanto, a chave é o valor da string de sua chave e o valor é ... o valor. Você pode usar a chave para acessar seu valor assim:
obj['name'] = 'John'
Se desta vez você exibir uma matriz, como esta:
Portanto, o valor é o seu objeto (coleção) e a chave é o índice da sua matriz desde:
Espero que responda a sua pergunta. Aqui está um JSFiddle para executar algum código e testar se você quiser: http://jsfiddle.net/ygahqdge/
Depurando seu código
O problema parece vir do fato de
$http.get()
ser uma solicitação assíncrona.Você manda uma consulta sobre seu filho, ENTÃO ao finalizar o navegador e baixá-lo executa com sucesso. MAS logo após enviar sua requisição você executa um loop usando
angular.forEach
sem esperar a resposta do seu JSON.Você precisa incluir o loop na função de sucesso
Isso deve funcionar.
Indo mais fundo
Você pode dar uma olhada nas APIs deferidas / prometidas ; é um conceito importante do Angular para tornar as ações assíncronas suaves.
fonte
success
eerror
foi descontinuado . O uso dethen
método em vez desuccess
é sugerido. Agora, @Colin, saia e responda algumas perguntas para conseguir 50 repetições! : Pvocê deve usar loops angular.forEach aninhados para JSON, conforme mostrado abaixo:
fonte
values.forEach(object => console.log(
$ {object.name}: $ {object.password}))
.O
angular.forEach()
irá iterar através de seujson
objeto.Primeira iteração,
Segunda iteração,
Para obter o valor de seu
name
, você pode usarvalue.name
ouvalue["name"]
. O mesmo com o seupassword
, você usavalue.password
ouvalue["password"]
.O código a seguir lhe dará o que você deseja:
fonte
Mude a linha para esta
fonte
No Angular 7, o loop for é como abaixo
fonte