[解決済み】ng-ifとng-show/ng-hideを比較すると、どのような場合に有利か？

質問

私は、次のことを理解しています。 ng-show と ng-hide は要素に設定されたクラスに影響し、その ng-if は、要素が DOM の一部としてレンダリングされるかどうかを制御します。

を選択する際のガイドラインはありますか？ ng-if オーバー ng-show / ng-hide またはその逆は？

解決方法は？

ユースケースによって異なりますが、違いをまとめると。

1. ng-if は、DOM から要素を削除します。これは、それらの要素にアタッチされていたハンドラやその他のものがすべて失われることを意味します。たとえば、子要素のひとつにクリックハンドラを結びつけていた場合 ng-if が false と評価されると、その要素は DOM から削除され、クリックハンドラは、たとえ ng-if が true に評価され、その要素が表示されます。ハンドラを再アタッチする必要があります。
2. ng-show/ng-hide は、DOMから要素を削除しません。CSSのスタイルを使って、要素を隠したり表示したりします（注：独自のクラスを追加する必要があるかもしれません）。こうすることで、子要素にアタッチされていたハンドラが失われることはありません。
3. ng-if は子スコープを作成する一方 ng-show/ng-hide はしません。

DOM にない要素はパフォーマンスへの影響が少なく、ウェブアプリが高速化したように見えるかもしれません。 ng-if と比較して ng-show/ng-hide . 私の経験では、その差はごくわずかです。の両方を使用した場合、アニメーションは可能です。 ng-show/ng-hide と ng-if Angularのドキュメントに両方の例があります。

最終的には、DOMから要素を削除することができるかどうかという問題に答える必要があります。