导航后实现逻辑

Question

在我的 Angular 应用程序中。我正在从 secondComponent 导航到 firstComponent 并使用路由器传输数据。我能够成功地做到这一点。在路由到 firstComponent 之后，我想实现一些逻辑。我没有任何点击事件来实现逻辑。作为 firstComponent 我路由到已经初始化和呈现。我可以使用哪种类型的方法或生命周期事件来实现逻辑。我试图将逻辑放在构造函数中，但它会抛出一个错误，因为该方法是在导航到组件之前实现的，并且变量未初始化。

第一个组件

 constructor(private route: Router,
              private router: ActivatedRoute) {

  this.router.params.subscribe(data => {
      this.Search(data);
    });

Search(data) {
    this.source.addFilter({field: 'test', search: data.testValue});
  }
}

第二个组件

 ngAfterViewInit() {
    this.searchService.onSearchSubmit()
      .subscribe((data: any) => {
        const testValue = data.term;
        this.route.navigate(['/test/path', {testValue}]);
      });
  }

Answer 1

您应该将逻辑从构造函数移动到 ngOnInit 生命周期挂钩。 如果在调用构造函数时实例化了类，则依赖于外部源的变量可能尚未初始化。这就是为什么将构造函数的主体留空并使用生命周期钩子来处理逻辑是一个好习惯的原因。