Как отображать данные каждый раз, когда есть разные заголовки? - PullRequest
Новая
       29

Как отображать данные каждый раз, когда есть разные заголовки?

0 голосов
/ 04 мая 2020

Как отобразить данные на компоненте html, если он имеет несколько разных заголовков?

Я работаю над приложением angular 7, сообщаю ему идентификатор отчета, затем возвращается другой результат, зависит от идентификатора отчета

, поэтому, если я передам reportid = 1, он отобразит 

FinancialId FinancialName  FinancialDate
1            cash           12/01/2020

если я передам reportid = 2, тогда он отобразит 

InventoryId InventoryName InventoryQty InventoryPrice
1             Stor1         10           50

У меня может быть 10 отчетов с разными заголовками и содержимым, поэтому мне нужно, как отображать данные, отличающиеся enet заголовком, отличным от stati c.

service.ts 

export class DisplayreportService {

  constructor(private http : HttpClient) { 

  }
GetReportDetailsByReportId(id : string){
    return this.http.get<any>('http://localhost:61265/api/report/Getreportdetails/id=' + id)
    .map(res=>res);
}

  }

на reportdetails.component.ts 

 reportdetailslist: any[];
  constructor(private router: ActivatedRoute, private _displayreport: DisplayreportService) { }

  ngOnInit() {
    const paramIndex = window.location.href.indexOf('id=');
    if (paramIndex > 0) {
      let param = window.location.href.substring(paramIndex);
      let param1 = param.split('&')[0];
      let param2 = param.substr(param.indexOf('=') + 1);

      this._displayreport.GetReportDetailsByReportId(param2).subscribe((data: any[]) => {
        this.reportdetailslist = data;

      });

Как показать данные по компоненту. html ниже 

  <div>
<table class="table table-hover" >  
  <thead>  
    <tr>  

      <th>i dont know table header returned</th>  
    </tr>  
  </thead>  
  <tbody>  
      <tr *ngFor="let rep of reportdetailslist">
        idont know columns returned 
      </tr>



  </tbody>  
</table>

что я пытаюсь сделать следующим образом 

 this.headerCols = Object.keys(data[0]);
        data.forEach((item) =>{
          let values = Object.keys(item).map((key)=> item[key]);
          this.contentBody.push(values);
   });
...