[解決済み】Angular 2でコンポーネントの再レンダリングを強制する方法は？

質問

Angular 2でコンポーネントの再レンダリングを強制する方法は？ Reduxを使ったデバッグのために、コンポーネントのビューを強制的に再レンダリングしたいのですが、可能ですか？

どのように解決するのですか？

レンダリングは変更検出後に行われます。 強制的に変更を検出し、変更されたコンポーネントのプロパティ値が DOM に伝搬されるようにする（そして、ブラウザがそれらの変更をビューにレンダリングする）には、以下のような方法があります。

• ApplicationRef.tick() - Angular 1の $rootScope.$digest() -- すなわち、完全なコンポーネントツリーをチェックします。
• NgZone.run(コールバック) - と同様 $rootScope.$apply(callback) -- つまり、Angular 2のゾーン内でコールバック関数を評価します。これは、コールバック関数を実行した後、コンポーネントツリー全体をチェックすることになると思うのですが、確かではありません。
• ChangeDetectorRef.detectChanges() - と同様 $scope.$digest() -- つまり、このコンポーネントとその子コンポーネントのみをチェックする。

をインポートし、インジェクトする必要があります。 ApplicationRef , NgZone または ChangeDetectorRef をコンポーネントに追加します。

あなたのシナリオでは、1つのコンポーネントだけが変更された場合、最後のオプションをお勧めします。