javascript - Angular 6 : continuously execute http request inside ngAfterContentChecked after receive data from parent component

Question

我是 Angular 的新手，我来自 React.js

我有一个问题，Angular 在从父组件接收数据后永远在 ngAfterContentChecked 中发出 HTTP 请求

我无法在 ngAfterContentInit 中发出请求，因为我需要等待父级完成发出请求

我只想让它在从父级获取数据后立即调用一次

在 React.js 中，我通常在 componentWillReceiveProps 中发出请求

在 Angular 中我这样做。

父组件:

//codes...
groupId = '';
//codes...

ngOnInit() {
  const id = '23esaddq3sdasd';
  this.dataService.getUser(id).subscribe(data => {
    //codes...
    this.groupId = data.groupId;
    //codes...
  });
}

子组件:

data = [];
@Input() groupId;
fetch;

ngAfterContentChecked() {
  if (this.groupId) {
    const res = this.dataService.getGroupMembers(this.groupId).subscribe(data => 
      this.data = data;
      this.fetch = 'done';
    });
    if (this.fetch === 'done') {
      res.unsubscribe();
    }
  }
}

我尝试取消订阅，但仍然继续执行代码。

任何人，请帮助我😭

Answer 1

您可以使用 ngOnChanges() 而不是 ngAfterContentChecked，它会在父组件使用 @input() 将数据传递给子组件时触发。

如果您有投影内容“ng-content”并访问父组件更改检测上的任何 DOM，将使用 ngAfterContentChecked 生命周期。