2017-10-05 14 views
0

これはFirebaseデータベースにアップロードしたJSONコンテンツです。 私はAngular 2アプリでこれにアクセスする必要があります。 オブジェクトにアクセスしようとしているときに、未定義とNaNが発生しています。このFirebase JSONをどのように反復処理しますか?

{ 
     "clients" : { 
     "clients" : { 
      "-Kdl_wRRkn7nJxgz4B54" : { 
      "balance" : "100.00", 
      "email" : "[email protected]", 
      "firstName" : "John", 
      "lastName" : "Doe", 
      "phone" : "555-555-5555" 
      }, 
      "-KdleehAQm0HgVFYdkUo" : { 
      "balance" : "350.00", 
      "email" : "[email protected]", 
      "firstName" : "Steve", 
      "lastName" : "Smith", 
      "phone" : "444-444-4444" 
      } 
     } 
     } 
    } 

私は

export class ClientsComponent implements OnInit { 
    clients:any[]; 
    totalOwed:number; 

    constructor(
    public clientService:ClientService 
) { } 

    ngOnInit() { 
    this.clientService.getClients().subscribe(clients => { 
     this.clients = clients; 
     console.log(this.clients); 
     this.getTotalOwed(); 
    }); 
    } 

    getTotalOwed(){ 
    let total = 0; 
    for(let i = 0;i < this.clients.length;i++){ 
     console.log(this.clients[i]); 
     total += parseFloat(this.clients[i].balance); 
    } 
    this.totalOwed = total; 
    console.log(this.totalOwed); 
    } 

} 

答えて

1

ここにこれにアクセスするにはまずオフにしようとしています、あなたはJSONを構造し直す必要があり、以下の構造を通じループのためのより良い、より良い練習になります。第二に、数値ではない理由は、バランスキーの値にアクセスしていないからです。

for(let i = 0; i < this.clients.length(); i++) { 
    console.log(this.clients[i].balance) 
} 

とJSON::

以下のデータ構造をループにあなたのコードは次のようになります

{ 
    "clients" : [ 
    { 
     "id" : "-Kdl_wRRkn7nJxgz4B54", 
     "balance" : "100.00", 
     "email" : "[email protected]", 
     "firstName" : "John", 
     "lastName" : "Doe", 
     "phone" : "555-555-5555" 
    }, 
    { 
     "id" : "-KdleehAQm0HgVFYdkUo", 
     "balance" : "350.00", 
     "email" : "[email protected]", 
     "firstName" : "Steve", 
     "lastName" : "Smith", 
     "phone" : "444-444-4444" 
    } 
    ] 
} 
関連する問題