ng-if と ng-show/ng-hide のどちらを優先すべきでしょうか? 質問する

ng-if と ng-show/ng-hide のどちらを優先すべきでしょうか? 質問する

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

どちらかをng-if選択する場合のガイドラインはありますか?ng-showng-hide

ベストアンサー1

使用ケースによって異なりますが、違いをまとめると次のようになります。

  1. ng-ifDOM から要素を削除します。つまり、すべてのハンドラーや、それらの要素にアタッチされているその他のものはすべて失われます。たとえば、クリック ハンドラーを子要素の 1 つにバインドした場合、がng-iffalse と評価されると、その要素は DOM から削除され、後で が true と評価されて要素が表示されても、クリック ハンドラーは機能しなくなりますng-if。ハンドラーを再アタッチする必要があります。
  2. ng-show/ng-hideDOM から要素を削除しません。要素の表示/非表示には CSS スタイルを使用します (注: 独自のクラスを追加する必要がある場合があります)。この方法では、子にアタッチされたハンドラーは失われません。
  3. ng-if子スコープを作成しますがng-show/ng-hide

DOM にない要素はパフォーマンスへの影響が少なく、 を使用した場合にng-if比べてWeb アプリが高速に見える場合があります。私の経験では、その違いはごくわずかです。とng-show/ng-hideの両方を使用した場合、アニメーションが可能です。Angular のドキュメントには両方の例が記載されています。ng-show/ng-hideng-if

最終的に答えなければならない質問は、DOM から要素を削除できるかどうかです。

おすすめ記事