在angular 5中，对象数组的类型返回object。 如何解决这个问题

Question

这是我在我的代码中使用的功能。在此使用了getOriginData（this.encodedData）httpclient，并且我已经调用了相应的API来获取响应。

  //Ts
  getOriginDetails() {
  this.createCaseService.getOriginData(this.encodedData)
  .subscribe((response) => {
    this.originData = response;
    console.log(typeof this.originData ); // ans is object

  },
    respError => {
      console.log('Error in api');
    });
}

// HTML
 <div class="form-group row">
    <label class="col-sm-2 col-form-label">Origin</label>
    <div class="col-sm-10">
      <select  (change)=" selectOrigin($event)" class="custom-select customArrow">
        <option value="">-- Select Origin Data --</option>
        <option *ngFor="let item of originData; let i = index;" [value]="item.id">{{item.name}}</option>
      </select>
    </div>
  </div>

因此，这是来自API的响应，如下图所示，可以清楚地将其视为对象数组。 。但是当我检查此响应的类型时，它的显示对象。当我在ngFor中使用ngFor在它中显示以下错误时。 因此，我担心是否有任何方法可以更改其类型？ 为什么在检查类型时不返回非数组？ 还有其他方法可以解决这个问题。因为我需要使用* ngFor将此响应用于迭代。

Answer 1

因为数组具有类型对象。 请参见示例因为数组是引用。

  const arr = [1,2,3]; console.log(typeof(arr)); 

使用* ngFor时可以显示HTML吗？

Answer 2

您可以尝试在服务中进行数据转换

getOriginData(data: Array<String>): Observable<Inter[]> {
return this.http.get<Inter[]>(Url, {params: this.params});
} 

其中Inter是您的数据接口：

export interface Dir {
    id: number;
    name: string;
    value: string;
    defaultValue: string;
    isActive?: boolean;
}

Answer 3

在将this.originData声明为对象之前，可能会出现此问题。 例如：

originData = {};
response = [1, 2, 3];

this.originData = this.response;

将导致originData仍然是一个对象。 通过执行此操作来解决此问题

originData = [];