angular - Angular 12 未绑定到来自 webapi 的值：返回 NgFor 仅支持绑定到 Iterables，例如数组

Question

我一直无法绑定到 Angular12/Typescript 中的 webapi 调用。

浏览器显示此错误：ERROR 错误：找不到类型为“object”的不同支持对象“[object Object]”。NgFor 仅支持绑定到 Iterables，例如 Arrays。

api 调用成功返回数据。我不确定我在这里缺少什么？

零件

@Component({
  selector: 'app-system-of-record-search', 
  templateUrl: './system-of-record-search.component.html',
  styleUrls: ['./system-of-record-search.component.scss']

})
export class SystemOfRecordSearchComponent implements OnInit {
  model?: SystemOfRecord[];

  constructor(
    private configApi: ConfigApi
  ) { }
  ngOnInit(): void { 
    this.configApi.searchSystemOfRecord().subscribe(
      (data: SystemOfRecord[]) => {
        this.model = data;
      }
    );
}

HTML

<div>
    <div *ngIf="model">
        <select id="selSystemOfRecord" class="form-control">
            <option *ngFor="let item of model" [ngValue]="item.systemOfRecordId">{{item.name}}</option>
        </select>
    </div>  
</div>

API 提供者：

  searchSystemOfRecord(): Observable<SystemOfRecord[]> {
    const url = `${this.domain}/api/systemofrecord/search`;
    return this.http.post<SystemOfRecord[]>(url, {}, { responseType: 'json' });
  }