angular2 *ngFor 异步渲染select选项报错

Question

用ngFor异步渲染select选项，在没有数据的情况下会报错，已经用ngif判断数组长度是否大于1了，如果否调到 elseBlock里 进行ngfor遍历 程序能正常跑，但是在elseBlock里面的函数还是会报错

代码片段如下：

  <select name="build" id="" #build="ngModel" [(ngModel)]="select.buildID" required>
  <option *ngIf="!buildings.length;else elseBlock"value="">请选择</option>
  <ng-template #elseBlock>
      <option *ngFor="let build of buildings" [value]="build.buildingID">{{build.buildingName}}</option>
  </ng-template>
  </select>
  

报错

Answer 1

<select name="build" id="" #build="ngModel" [(ngModel)]="select.buildID" required>
<option *ngIf="!buildings.length;else elseBlock"value="">请选择</option>
<ng-template #elseBlock>

  <option *ngFor="let build of buildings" [value]="build.buildingID">{{build.buildingName}}</option>

</ng-template>
</select>
这样写没问题，发现是其他地方代码报的错

Answer 2

你的报错buildingID没取到 看可以试下
<option *ngFor="let build of buildings" [value]="build?.buildingID">{{build?.buildingName}}</option>

异步渲染也可以最外层包裹 <ng-template *ngIf="buildings"></ng-template>保证数据存在