0

ユーザーがデータをロードする特定のコンポーネントを見た場合にのみ、データをロードしたい。したがって、コンポーネントが表示される前にロードしないでください。

私はこのテンプレートを持っています:

<button (click)="showMyCompontente()">Click me</button>
<app-other-component *ngIf="show"></app-other-component>

この TypeScript コードでは:

export class MyComponent implements OnInit {
  show = false;

  ngOnInit() {
  }

  showMyCompontente() {
    this.show = !this.show;
  }
}

そして、ポイントは次のとおりです。

@Component({
  selector: 'app-other-component',
})
export class OtherComponent implements OnInit {

  ngOnInit() {
    this.load();
  }

  load() {
    // needs to load datas only if the user see the component
  }
}

コンポーネントがユーザーに表示されている場合にのみOtherComponent開始するにはどうすればよいですか? this.load()ユーザーがコンポーネントを非表示にしてから表示した場合、データを再度リロードしたいと思います。

それ自体が表示または非表示になったことを検出するために、コンポーネント内のソリューションが必要です。それは、私には多くのコンポーネントがあり、さまざまなバリエーションでお互いを呼び出しているからです。

ユーザーがコンポーネントを表示したときにのみ起動する Angular ライフサイクル フックはどれですか?

4

1 に答える 1