角度处理json对象编译但抛出错误

Posted 2021-03-28

我在angular6项目中有以下组件。

export class BoxdataComponent implements OnInit {
  numberOnSite: Object;
  number: number;
  numberClicks: Object;
  constructor(private _pullAnalyticsService: PullanaliticsService) {}

  ngOnInit() {
    timer(0, 5000).pipe(
      switchMap( _ => this._pullAnalyticsService.httpGetAsync()
    )).pipe(
      map(ret => {
        console.log(ret.ListOfData[0]); // ListOfData[0]);
        console.log(ret.ListOfData[1]);
        this.numberOnSite = ret.ListOfData[0];
        this.numberClicks = ret.ListOfData[1];
      })
    ).subscribe();
  }

}

其中httpGetAsync()在服务中被定义为。

  httpGetAsync() {
      return this.httpClient.get(this.theUrl);
  }

现在这工作正常我在控制台中看到了正确的数据，而numberOnSite和numberClicks是正确的值。但是我收到了错误：

ERROR in src/app/boxdata/boxdata.component.ts(22,25): error TS2339: Property 'ListOfData' does not exist on type 'Object'.
src/app/boxdata/boxdata.component.ts(23,25): error TS2339: Property 'ListOfData' does not exist on type 'Object'.
src/app/boxdata/boxdata.component.ts(24,33): error TS2339: Property 'ListOfData' does not exist on type 'Object'.
src/app/boxdata/boxdata.component.ts(25,33): error TS2339: Property 'ListOfData' does not exist on type 'Object'.

注意：ret是一个json对象。

定义为：

{"ListOfData": [  4467 , 4065 ]}

项目成功刷新后抛出这些错误。此外，如果我使用ctrl-C停止项目并运行ng serve，项目将不再“编译”。但是，如果我删除有问题的行，运行ng serve然后再将它们更改回来就可以了。为什么项目这样做？我和vs代码在一起，如果它与它有任何关系。谢谢。

答案

将管道更改为

map((ret:any) => {

这是由类型检查引起的编译错误，因为ret被视为类型Object，它没有ListOfData属性。

通过输入ret:any，我们删除了类型检查，并说它可能有任何属性

另一答案

请删除“对象”声明的变量让我们像这样声明

numberOnSite：任; //如果你的变量数组使用这样的任何[] = []：numberClicks：any;