Ernany Daniel Ernany Daniel - 5 months ago 7
AngularJS Question

How to use an Angular variable to control the index of an angular array?

I'm stuck in a part of a project that I need to show some informations of an item, and if I click in a list of other items the informations must change (not the case right now).
To show the first item of an array is easy if I use 0 between [ ], but if I try to use the $scope.id = 0, nothing happens.

HTML:

<div class="col-md-5">
<b>{{faturas[{{id}}].faturan}}</b>
<p>Vencimento: <span>{{faturas[{{id}}].venc}}</span></p>
</div>
<div class="col-md-7">
<p>PerĂ­odo: {{faturas[{{id}}].ini}} a {{faturas[{{id}}].fim}}</p>
<p>Valor: R$ <span>{{faturas[{{id}}].valor}}</span></p>
</div>


Node:

var queryString = 'SELECT * from faturas WHERE empID = '+usuarioSession.empID;
connection.query(queryString,function(err,rows) {
var ret = [];
for (var i = 0; i < rows.length; i++) {
ret.push ({
index: i,
faturan: "Fatura "+(i+1),
venc: rows[i].fatDataVenc,
ini: rows[i].fatDataIni,
fim: rows[i].fatDataFim,
valor: rows[i].fatValor
});

}
response.writeHead(200, {'Content-Type': 'application/json'});
response.end(JSON.stringify(ret), 'utf-8');
});


Angular:

app.controller('faberto',function($scope,$http){
$scope.id = 0;
$http.get('/servico/faberto').success(function(data) {
$scope.faturas = angular.fromJson(data);

});
});

Answer

As @Claies said, you can't use a {{ }} inside another one! Check this link: https://plnkr.co/edit/mHNaTXBNfzTGD3T0ujHY

I've created a mock to show you how ng-repeat would be more suitable for the situation!

Comments