访问在订阅之外初始化的变量时未定义

Question

我正在使用Apex图表，图表在第二个组件中。我需要调用一个函数来从第一个组件切换第二个组件中的一些系列。我现在可以调用这个函数了，但是当我试图调用订阅内部的图表时，它是未定义的。但是，如果我在ngAfterViewInit()中调用该图表，则该图表是正确的。那么，有谁能建议我如何访问订阅内的图表呢？

第二部分：

​

export class DashboardComponent implements OnInit {
  @ViewChild("chart") chart!: ChartComponent;
  constructor(public servic: MainService, private spinner: NgxSpinnerService, private router: Router) {
    this.servic.receiveMessage().subscribe(message => {
      this.toggle(message)
    })
  }
  public toggle(state: string) {
    console.log(this.chart);

  }
}

​

第二个组件的HTML：

​

Answer 1

它不是undefined，因为它在.subscribe()内部。它是undefined，因为它在constructor()中。这是一个运行时问题。将订阅移动到OnInit()或AfterViewInit() 生命周期钩

Answer 2

您的服务文件稍后将被调用，这就是为什么您的“消息”uder订阅未定义，将您的服务从构造函数()移到OnInit()中。

constructor(public servic: MainService, private spinner: NgxSpinnerService, private router: Router) {}
    ngOnInit(){
    this.servic.receiveMessage().subscribe(message => {
          this.toggle(message)
        })
    }
public toggle(state: string) {
    console.log(this.chart);

  }