angular - Angular ngFor 无法显示数据

Question

我是 Angular 的新手，我已经阅读了很多关于我的问题的讨论，但没有找到解决方案。我的前面正在为我的 ngFor 生成一个。

我可以在控制台中看到我从我的 API 获取数据。有人可以帮助我吗？

这是我的 component.ts

import { Component } from '@angular/core';
import { environment } from '../../../environments/environment';
import { BasicRequestsService } from '../services/basic-requests.service';
import { Observable, concat } from 'rxjs';




@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
})


export class HomeComponent {
    env = environment;
    usersList;

  constructor(
    private basicRequestsService: BasicRequestsService,

    ) { }
  ngOnInit() {
    const args = new Array();

    concat(
      this.getUsersData(),


      )
    .subscribe();

  }

  getUsersData(): Observable<any>  {
    return Observable.create(observer => {
      this.basicRequestsService.get('/users')
      .subscribe(data => {
        this.usersList = data;
        console.log(this.usersList);
      });
    });
  }
}

这是我的 HTML

  <table class="table table-sm table-hover">
      <thead class="thead-dark">
        <th>Client</th>

      </thead>
      <tbody>
        <tr *ngFor="let userList of usersList">
          <td>{{ userList.firstName }}</td>
        </tr>
      </tbody>
    </table>

我正在从我的 API 加载数据。

标签： angular

Answer 1

试试下面的，

<table class="table table-sm table-hover">
      <thead class="thead-dark">
      <tr>
        <th>Client</th>       
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let userList of usersList">
       <td>{{ userList?.firstName }}</td>
      </tr>
      </tbody>
 </table>