angular - 函数实现丢失或没有紧跟在声明之后，TypeScript 类

Question

我有一个手写数组来填充我类的表格，现在我得到这个数组的 来自 ngOnInit 上的 JSON 的内容，但它的结构不符合我的需要。

所以我正在尝试编写一个函数来用我在 ngOnInit 上获得的这个新数组填充表数组。

问题是，当我在我的 TS 类中的函数外部编写代码时，我收到此错误“函数实现丢失或没有立即跟随声明”。

为什么会这样，可以做些什么来解决这个问题？

TS

export class MyComponent implements OnInit {
    users: Object;

    constructor(private tstService: MyComponentService) { this.source = new LocalDataSource(this.data) }

    ngOnInit(): void {
        this.tstService.getTstWithObservable()
        .map(result => result.map(i => i.user.data))
        .subscribe(
           res => { this.users = res; }
       );
    }

    console.log(this.users); // Here, just an example. Throws 'Function implementation is missing or not immediately following the declaration'

    data = [
        {
          title: 'Monthly',
          sdate: '01/04/1990',
          edate: '30/09/1990',
        },
      ];

    source: LocalDataSource;
}

Answer 1

这里的问题是您在“可执行区域”(例如 ngOnInit).

如果你需要执行 console.log(this.users); 以查看 devtools 中的数据，你应该将 console.log 部分移到里面ngOnInit 是类 MyComponent 的可执行部分，或者可能在 constructor 中。

我建议你这样做:

ngOnInit(): void {
    this.tstService.getTstWithObservable()
    .map(result => result.map(i => i.user.data))
    .subscribe(
       res => {
                this.users = res;
                console.log(this.users); // <-- moved here!
       }
   );
}

关键是您要执行的代码需要在 Angular 执行的某个方法中。

参见 this demo有一些例子。相关代码如下:

export class AppComponent  implements OnInit{
  name = 'Angular 6';

  constructor() {
    console.log(name); // OK
  }

  ngOnInit() {
    console.log('sample not giving error'); // OK
  }

 // comment line below and the error will go away
  console.log(name); // this will throw: Function implementation is missing or not immediately following the declaration
}