問題タブ [angularjs-ng-include]

ng-include を使用して、次のように Web アプリケーションにサイドバーとナビゲーション バーをインポートします

古い</strong>ブラウザを使用しています。エクスペリエンスを向上させるには、ブラウザをアップグレードしてください</a>。</p>

両方のhtmlファイルに含まれるtheme.jsを内部で使用したい。私がしなければならないこと？

私は自分のテンプレートを javascript 文字列配列にプリロードしていvar t = JST['firstTemplate']ますt。

このプリロードされたテンプレートをng-includeディレクティブで使用するにはどうすればよいですか?

このシナリオのテンプレートは、ネストされたビューとテンプレート、および独自のネストされたスコープとコントローラーを使用して、より複雑になる可能性があることに注意してください。ng-bind ディレクティブのいずれかが役立つかどうかはわかりませんか?

アップデート：

そのソースを見ると、ng-includeこれを行う良い方法は、テンプレートの読み込みロジックをカスタマイズ可能なプロバイダーに分離することです。

現在のデフォルトの読み込みメカニズムは、キャッシュ プロバイダーとして単純に実行$http.getします。$templateCacheテンプレート コンテンツをテンプレート キャッシュに挿入できるようですがJST['firstTemplate']、すべてのテンプレートについて、起動時にそれを行う必要があります。

そして、

また、すべての ng-include と並行して、このテンプレートの事前キャッシュを行うカスタム ディレクティブを作成することもできます。それはまた不格好に思えます。

更新 #2

すでにプリロードされている JST ハッシュを使用するように、templateCache をオーバーライドしてみます。これが機能する場合、結果を投稿します。

ヘッダー、サイドバー、フッターなどの再利用可能なウィジェットを含む HTML テンプレートを作成するために、パフォーマンスに関して角度のあるアプリを設計するための最良の方法を知りたいです。ヘッダーとフッターはほぼ同じですが、サイドバーは特定のページで異なる場合があります。

--- index.html

-- header.html

$templateCache に header.html を入れたほうがいいでしょうか? たとえば、次のようにします。

-- header.html

または、ウィジェットごとに次のようなディレクティブを使用する必要があります: <appHeader></appHeader>... ?

これらのウィジェットを各画面に埋め込むために、パフォーマンス、結束、再利用性、およびスケーラビリティに関して、どちらが優れていますか?

次のコードがあります。

次に、itemG.htmlに次のものがあります。

ng-repeat ですべての画像を印刷するにはどうすればよいですか?

私のページにレンダリングされているムービーリストがあり、コントローラーコードは次のようになります

チェックボックスフィルターを使用してリストをフィルタリングしようとするまで、すべて正常に機能します。ng:include を使用して、filters.html をインクルードしています。フィルターがデータ テンプレートの一部である場合、すべて正常に機能しますが、ng:include の一部である場合、フィルターは機能しません。ng:include が子スコープを作成することは知っていますが、これを回避する方法がわかりません。私のフィルターコードは次のようになります

データリピーターは次のとおりです。

ng-include を使用して階層ツリーを再帰的にレンダリングしようとしています。ここにフィドルがあります

問題は、レンダリングが完了する前にリンク関数が呼び出され、空のリストでメニュー プラグインを初期化しようとすることです。

私はonloadng-include があることを知っていますが、階層構造のためにカウントの計算が難しくなるため、各オンロードでカウンターをインクリメントし、要素のカウントと比較するような醜いハックに頼りたくありません。

ng-include が完全な再帰レンダリングを終了し、すべての要素がページ上にあることを知るためのよりクリーンな方法は何ですか?

リンクの代わりに postLink を使用しようとしましたが、ディレクティブはまだ空を出力します<ul>:

私はAngularJSを初めて使用し、2つの異なるHTMLパーシャルにロードされるリストとグリッドビューのトグルスイッチボタンの特定のチュートリアルを見つけることができませんでした. ng-include公式、公式ドキュメントを読み、 ng-switchSOを検索しました。残念ながら、 UI-routerは使用したくありません。

2 つのパーシャル (list.htmlおよびgrid.html) でロードすることは、これをコーディングする正しい Angular の方法ですか?

私が見つけた最も関連性の高いヘルプは次のとおりです。

1.http://tutorialzine.com/2013/08/learn-angularjs-5-examples (例 #5)

例 #5 には洞察に満ちたコメントがありました。

素敵な簡単な例 - よくできました。グリッド ビューとリスト ビューを切り替える最後の例は、オプションと表示/非表示の両方を作成するため、あまり効率的ではありません。よりシンプルで優れたアプローチは、リピーターと ng-switch で単一の ul を使用し、ng-switch-case を使用して代替リスト要素を有効にすることです。-ヨハン

2.http://www.adobe.com/devnet/html5/articles/getting-started-with-angularjs.html

3. https://stackoverflow.com/questions/12577378/create-a-single-html-view-for-multiple-partial-views-in-angularjs/12584774#12584774

4.https://stackoverflow.com/questions/15974086/conditional-ng-include-in-angularjs

私のHTMLコード：

私のJSコード：