2

私はのng-include内部を持っていng-repeatます:

<div ng-repeat="tab in tabs" ng-show="tab.active">
  <div ng-include="tab.url" class="no-padding no-margin"></div>
</div>

ユーザーがタブをクリックした場合にのみコンテンツを DOM にロードする必要があるため、次のように使用してng-ifng-includeます。

<div ng-repeat="tab in tabs" ng-show="tab.active">
    <div ng-if="tab.loaded">
        <div ng-include="tab.url" class="no-padding no-margin"></div>
    </div>
</div>

この部分は正常に動作しています。ただし、動的コンテンツを必要とするタブが 1 つあるため、ユーザーがそのタブをクリックするたびに、そのコントローラーのスコープを再作成する必要があります。

私の理解に基づいて、ng-ifDOM要素を削除/再作成するために使用することもできます。ng-if ドキュメントによると:

ngIf ディレクティブは、{expression} に基づいて DOM ツリーの一部を削除または再作成します

...

要素が ngIf を使用して削除されると、そのスコープが破棄され、要素が復元されると新しいスコープが作成されます

loaded動的タブのプロパティを false に設定するコードを追加しました。これにより、その内容が DOM から削除されます。

次に、スコープが再作成されるように true に戻しますが、スコープを再度作成することはできません。

私のアプローチは正しいですか、それともng-if私の目的に使用できるものがありますか。

4

1 に答える 1