-1

我正在尝试将 API 给出的接口的 JSON 转换为由专用对象组成的不同数组。对象的类型在接口中作为变量给出。

界面：

export interface Interface{
  interfaceClassType: string;
}

我正在访问我的 json 数据，如下所示：

getJSON(): Observable<Interface[]> {
    return this.http.get<Interface[]>(URL)
      .pipe(
        retry(2),
        catchError(this.handleError)
      );
  }

这个方法是这样调用的：

 arrayWithObjects: Interface[];
 class1Array: Class1[];
 class2Array: Class2[];

 processJSON(): void {
    this.configService.getJSON().subscribe(results => this.arrayWithObjects = results);
    this.arrayWithObjects.forEach (function (object) {
      switch (object.interfaceClassType) {
        case "first":
          this.class1Array.push(object as Class1);
          break;
        case "second":
          this.class2Array.push(object as Class2);
          break;
      }
    }.bind(this))
  }

当我这样称呼它时，我得到了相同的结果：

 arrayWithObjects: Interface[];
 class1Array: Class1[];
 class2Array: Class2[];

 processJSON(): void {
    this.configService.getJSON().subscribe(results => this.arrayWithObjects = results);
    this.arrayWithObjects.forEach ((object) => {
      switch (object.interfaceClassType) {
        case "first":
          this.class1Array.push(object as Class1);
          break;
        case "second":
          this.class2Array.push(object as Class2);
          break;
      }
    })
  }

当我执行此方法时，我总是收到一条错误消息：ERROR TypeError: this.class1Array is undefined

4

2 回答 2

0

这里有2个问题。

  1. this.arrayWithObjects是异步分配的。当你这样做的时候，forEach它仍然是未分配的。要解决它，请移动forEach订阅内部。
processJSON(): void {
  this.configService.getJSON().subscribe(results => {
    this.arrayWithObjects = results;
    this.arrayWithObjects.forEach (
      ...
    );
}

更多关于异步数据的信息在这里。

  1. 使用箭头函数表示法而不是传统的 JSfunction将this关键字指向类成员变量。在 JSfunction中，this指向函数的范围，而不是类。
processJSON(): void {
  this.configService.getJSON().subscribe(results => {
    this.arrayWithObjects = results;
    this.arrayWithObjects.forEach((object) => {       // <-- arrow function here
      switch (object.interfaceClassType) {
        case "first":
          this.class1Array.push(object as Class1);
          break;
        case "second":
          this.class2Array.push(object as Class2);
          break;
      }
    });               // <-- `bind()` not required
  });
}
于 2020-07-23T13:13:29.230 回答
0

使用普通函数作为回调不会保留其this内部的范围。使用箭头函数可以解决这个问题。

this.arrayWithObjects.forEach ((object) => {
      console.log(this.class1Array);
})
于 2020-07-23T13:12:02.160 回答