私はそれを理解しておりng-show
、ng-hide
要素に設定されたクラスに影響を与え、ng-if
要素が DOM の一部としてレンダリングされるかどうかを制御します。
どちらかをng-if
選択する場合のガイドラインはありますか?ng-show
ng-hide
ベストアンサー1
使用ケースによって異なりますが、違いをまとめると次のようになります。
ng-if
DOM から要素を削除します。つまり、すべてのハンドラーや、それらの要素にアタッチされているその他のものはすべて失われます。たとえば、クリック ハンドラーを子要素の 1 つにバインドした場合、がng-if
false と評価されると、その要素は DOM から削除され、後で が true と評価されて要素が表示されても、クリック ハンドラーは機能しなくなりますng-if
。ハンドラーを再アタッチする必要があります。ng-show/ng-hide
DOM から要素を削除しません。要素の表示/非表示には CSS スタイルを使用します (注: 独自のクラスを追加する必要がある場合があります)。この方法では、子にアタッチされたハンドラーは失われません。ng-if
子スコープを作成しますがng-show/ng-hide
、
DOM にない要素はパフォーマンスへの影響が少なく、 を使用した場合にng-if
比べてWeb アプリが高速に見える場合があります。私の経験では、その違いはごくわずかです。とng-show/ng-hide
の両方を使用した場合、アニメーションが可能です。Angular のドキュメントには両方の例が記載されています。ng-show/ng-hide
ng-if
最終的に答えなければならない質問は、DOM から要素を削除できるかどうかです。