[解決済み] ng-includeノードをテンプレートに置き換える?
2023-06-09 04:25:15
質問
angularの初心者です。を使用することは可能ですか? を置き換えることができますか? ng-includeノードを含まれるテンプレートの内容で置き換えることは可能ですか?例えば、で。
<div ng-app>
<script type="text/ng-template" id="test.html">
<p>Test</p>
</script>
<div ng-include src="'test.html'"></div>
</div>
生成されたhtmlは
<div ng-app>
<script type="text/ng-template" id="test.html">
<p>Test</p>
</script>
<div ng-include src="'test.html'">
<span class="ng-scope"> </span>
<p>Test</p>
<span class="ng-scope"> </span>
</div>
</div>
しかし、私が欲しいのは
<div ng-app>
<script type="text/ng-template" id="test.html">
<p>Test</p>
</script>
<p>Test</p>
</div>
どのように解決するのですか?
私はこれと同じ問題を持っていて、まだ動的なテンプレートを含めるために ng-include の機能を望んでいました。私は動的な Bootstrap ツールバーを構築しており、CSS スタイルを適切に適用するために、よりきれいなマークアップが必要でした。
興味のある人のために、私が考え出した解決策を紹介します。
HTMLです。
<div ng-include src="dynamicTemplatePath" include-replace></div>
カスタムディレクティブです。
app.directive('includeReplace', function () {
return {
require: 'ngInclude',
restrict: 'A', /* optional */
link: function (scope, el, attrs) {
el.replaceWith(el.children());
}
};
});
この解決策を上記の例で使用した場合、scope.dynamicTemplatePath を 'test.html' に設定すると、望ましいマークアップになります。
関連
-
[解決済み] プリフライト応答が成功しない
-
[解決済み] AngularJSでkeypressイベントを使用するには?
-
[解決済み] Apigee API へのリクエストで 401 レスポンスエラーが発生する
-
angularjsのルーティングについて $stateと$stateParamsの話
-
[解決済み] AngularJs .$setPristineでフォームをリセットする
-
[解決済み] Ui-srefがクリッカブルリンクを生成しない/動作しない
-
[解決済み] なぜAngularJSはselectに空のオプションを含めるのですか?
-
[解決済み] Angularディレクティブの再帰性
-
[解決済み] データベースから動的な HTML 文字列をコンパイルする
-
[解決済み] ディレクティブ定義の `replace` はどのように使用するのですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】TypeError: window.initMap is not a function
-
[解決済み】Angularjsのng-viewが動作しない。
-
[解決済み】angularのonLoadとng-initの違いについて
-
[解決済み] data-ng-file-selectが動作しないのはなぜですか?
-
[解決済み] AngularJSで画像を表示する
-
angularでのng-repeatとtrack by
-
[解決済み] AngularJS: ngRouteが動作しない。
-
[解決済み] どのように$state.goにパラメータを追加しますか?
-
[解決済み] AngularJSのサービスをコンソールからテストするにはどうしたらいいですか?
-
[解決済み】ng-includeの正しい文法は何ですか?