Angular 6：如何显示二维数组

Question

这是我从服务中获得的阵列数据：

如何在组件上使用此数组

      <div *ngFor="let i of service$">

        <div class="row">
                <div class="col-lg-4" *ngFor="let j of i">
                    {{j.title}}

                </div>  
        </div>

      </div>

我的component.ts，我在构造函数中调用getService（）。

 service$: any;
 getService() {
this.serviceService.get_service()
  .pipe(first())
  .subscribe(
      data => {

         this.service$ = data;

         console.log(this.service$);

      },
      error => {
          this.error = error;

      });

}

Answer 1

使用异步管道，该管道显示来自API的数据。

<div *ngFor="let i of service$ | async">

        <div class="row">
                <div class="col-lg-4" *ngFor="let j of i">
                    {{j.title}}

                </div>  
        </div>

      </div>

Answer 2

您的服务电话应该看起来像

service$: any;

ngOnInit(){
    this.service$ =  this.serviceService.get_service().pipe(
        catchError(error => this.error = error)
    );
}  

Answer 3

我相信您在TS中有一些问题。首先定义变量，如：

 service$: any[] = [];

然后删除pipe（）并使用以下代码：

getService() {
  this.serviceService.get_service()
  .subscribe(
      data => {
         this.service$ = data;
         console.log(this.service$);
      },
      error => {
          this.error = error;

      });
}

我希望您返回get_service（）这样的东西：

return this.http.get('YOUR_URL')
      .map((response) => response.json());

您的 HTML 对我来说不错。