BinaryDevelop
  1. ホーム
  2. ジャバスクリプト

[解決済み】ng-includeの正しい文法は何ですか？

2022-03-24 16:58:32

質問

の中にHTMLスニペットを入れようとしています。 ng-repeat が、includeがうまくいきません。現在の構文では ng-include が以前と違っている。を使った例を多く見かけます。 

<div ng-include src="path/file.html"></div>

しかし、その中の 公式ドキュメント を使用するように書かれています。 

<div ng-include="path/file.html"></div>

しかし、その後 ページ下 と表示されます。 

<div ng-include src="path/file.html"></div>

とはいえ、試しに 

<div ng-include="views/sidepanel.html"></div>


<div ng-include src="views/sidepanel.html"></div>


<ng-include src="views/sidepanel.html"></ng-include>


<ng-include="views/sidepanel.html"></ng-include>


<ng:include src="views/sidepanel.html"></ng:include>

私のスニペットはたいしたコードではありませんが、いろいろなことが行われています。 テンプレートを動的に読み込む ng-repeat の中身を入れ替えると、問題が発生する可能性がありました。 sidepanel.html という単語だけで foo と言っても、何も出てきません。

また、このようにページ内で直接テンプレートを宣言することも試してみました。 

<script type="text/ng-template" id="tmpl">
    foo
</script>

のすべてのバリエーションを実行します。 ng-include を参照し、スクリプトの id を実行しても、何も起こりません。

私のページはもっとたくさんあったのですが、今はこれだけに絞りました。 

<!-- index.html -->
<html>
<head>
<!-- angular includes -->
</head>
<body ng-view="views/main.html"> <!-- view is actually set in the router -->
    <!-- views/main.html -->
    <header>
        <h2>Blah</h2>
    </header>
    <article id="sidepanel">
        <section class="panel"> <!-- will have ng-repeat="panel in panels" -->
            <div ng-include src="views/sidepanel.html"></div>
        </section>
    </article>
<!-- index.html -->
</body>
</html>

ヘッダーはレンダリングされますが、その後、私のテンプレートはレンダリングされません。コンソールやNodeからエラーは出ません。 src="views/sidepanel.html" を表示し、テンプレートに移動します。 foo ).

解決方法は？

をシングルクォートする必要があります。 src の文字列を二重引用符で囲んでください。 

<div ng-include src="'views/sidepanel.html'"></div>

ソース

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します