数据来自API，但不显示。Angular 9 ABP 框架

Question

我想在放置在标头子组件中的选择控件中填充数据，但数据来自 API，但不显示。

 ngOnInit() {

    this._assingedSiteService.getAssignedSitesForLogInUser().subscribe(

      (res) => {

        this.sites = res;

        console.log(this.sites);

      },

      (error) => {

        console.log(error);

      }

    );

  }

<li class="nav-item">

  <select class="form-control">

    <option *ngFor="let site of sites">

      {{site.siteName | json}}

    </option>

  </select>

</li>

Answer 1

在渲染页面之前需要等待接收到的数据。你可以做两件事：使用布尔值和ngIf指令：&nbsp;loadingData = true;&nbsp;ngOnInit() {&nbsp; &nbsp; &nbsp;this._assingedSiteService.getAssignedSitesForLogInUser().subscribe((res) => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;this.sites = res;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;console.log(this.sites);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;this.loadingData = false;&nbsp; &nbsp; &nbsp; &nbsp;}, (error) => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;console.log(error);&nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp;);&nbsp;}模板&nbsp; &nbsp;<select class="form-control" *ngIf="!loadingData">&nbsp; &nbsp; &nbsp;<option *ngFor="let site of sites">&nbsp; &nbsp; &nbsp; &nbsp;{{site.siteName | json}}&nbsp; &nbsp; &nbsp;</option>&nbsp; &nbsp;</select>我更喜欢，如果您的订阅中没有逻辑，请async在模板中使用管道：&nbsp;sites$: Observable<Site>;&nbsp;ngOnInit() {&nbsp; &nbsp; this.sites$ = this._assingedSiteService.getAssignedSitesForLogInUser();&nbsp;}模板：&nbsp; &nbsp;<select class="form-control">&nbsp; &nbsp; &nbsp;<option *ngFor="let site of sites$ | async">&nbsp; &nbsp; &nbsp; &nbsp;{{site.siteName | json}}&nbsp; &nbsp; &nbsp;</option>&nbsp; &nbsp;</select>