Как заполнить 2D массив в Angular4, используя вызов сервера GET для каждой строки? - PullRequest
0 голосов
/ 10 января 2019

Я пытаюсь заполнить двумерный массив tableData , каждая строка которого выбирается вызовом GET. Но по завершении заполнения массива ничто не отражается как результат в html-интерфейсе компонента. Его отображается как пустой.

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DataFetch } from './dataFetch';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  header: DataFetch ;
  header1 : string[];
  header2 : string[];
  tableData : string[][];
  constructor(private http: HttpClient) {}
  ngOnInit() {
  this.http.get('assets/table-header.json').subscribe((data : DataFetch) => {this.header1 = data["header1"];});
  this.http.get('assets/table-header.json').subscribe((data : DataFetch) => {this.header2 = data["header2"];});
 let i =1;
 this.tableData=[];
 do{
   let str = "row["+i+"]";
   this.http.get('assets/table-data.json').subscribe((data : DataFetch) => {
     let j = 0;
     this.tableData[i]=[];
     for(let item in data[str])
     {
       this.tableData[i][j]=item;
       j = j+1;
     }
    });
   i = i+1; 
}while(i<5);
  }
}

Используемый файл json (table-data.json):

{
    "row[1]": ["21/12/2018 15:00:01", "21/12/2018 15:10:03", "10", "M1X",
        "setr.010.001.04", "BB",
        "BB", "DFDS", "0000000013715338", "0000000013715338"
    ],
    "row[2]": ["21/12/2018 15:00:01", "21/12/2018 15:10:03", "10", "M2X",
        "setr.010.001.04", "BB",
        "BB", "DFDS", "0000000013715338", "0000000013715338"
    ],
    "row[3]": ["21/12/2018 15:00:01", "21/12/2018 15:10:03", "10", "M3X",
        "BB",
        "BB", "DFDS", "0000000013715338", "0000000013715338"
    ],
    "row[4]": ["21/12/2018 15:00:01", "21/12/2018 15:10:03", "10", "M4X",
        "BB",
        "BB", "DFDS", "0000000013715338", "0000000013715338"
    ]
}

Соответствующий интерфейсный html-компонент (то есть пустой):

<div style="text-align:center">
data is {{tableData[1][1]}}
</div>

Класс DataFetch определяется как:

export class DataFetch
 {
 public header1: string[]=[];
 public header2 : string[]=[];
 public row: string[][];
 }

header1 и header2 работают нормально с рендерингом вывода. Используется англоязычная версия 4. Любые исправления кода в качестве предложения?

...