2016-06-14 10 views
0

商品に関するいくつかの情報を表示する必要があります。他の商品のリストをクリックすると、情報が変更されなければなりません。角度変数を使用して角度配列のインデックスを制御する方法は?

[]の間に0を使用すると配列の最初の項目を表示するのは簡単ですが、$ scope.id = 0を使用しようとすると何も起こりません。

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> 

はノード:

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'); 
}); 

角度:

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

    }); 
}); 
+1

まず、 '{{f {{id}}。faturan}}'の代わりに、 '{{}}'を別の式の中で使うことはできません。 faturas [id] .faturan}} '。しかし、大きな問題は、配列インデックスで項目にアクセスするのではなく、この種の操作に 'ng-repreat'を使用しない理由です。 – Claies

+0

@Claiesが正しいです。 ng repeatを使うと、本当にインデックスが必要な場合は、$ indexを使うことができます。ほとんどの場合、あなたはしません。 –

+0

ありがとうございました!この場合、ng-repeatを使う方が良いとは知らなかった。通常は、すべての "リスト"を印刷するのに使う。 –

答えて

2

@Claiesはあなたが別のものの内側{{ }}を使用することはできません、言ったように!このリンクをチェックしてください:https://plnkr.co/edit/mHNaTXBNfzTGD3T0ujHY

ng-repeatが状況にどのように適しているかを示すモックを作成しました。

関連する問題