AngularJSでのng-includeのパス指定の方法
AngularJSのng-includeのパス指定の方法はクセがある。
例えば「template.html」を指定するにはこうする。
ポイントは、srcの「ダブルクオーテーションの中にさらにシングルクォーテーションを書いてその内側にパスを書く」ということ!
クセあるでしょう?(^^);
パス指定の方法でもうひとつ注意したいのが、相対パス。
ng-includeはincludeされた側のHTML内でもng-includeをネストして使うことができるが、その場合のパス指定はどうなるか?
例えばファイルシステム上で
index.html
templates/template.html
templates/subtemplates/subtemplate.html
という位置関係になっているとする。
まずindex.htmlでtemplate.htmlを読み込むには「templates/template.html」と指定する。これは普通に納得がいくだろう。
次に、template.htmlでsubtemplate.htmlを読み込むにはどうするか?「subtemplates/subtemplate.html」ではない。「templates/subtemplates/subtemplate.html」だ。
つまり、「指定すべき相対パスは、あくまでコントローラーとなるファイルからのパスとなり、ファイルシステム上での位置関係とは無関係」ということなので注意したい。
例えば「template.html」を指定するにはこうする。
<ng-include src="'template.html'"></ng-include>
ポイントは、srcの「ダブルクオーテーションの中にさらにシングルクォーテーションを書いてその内側にパスを書く」ということ!
クセあるでしょう?(^^);
パス指定の方法でもうひとつ注意したいのが、相対パス。
ng-includeはincludeされた側のHTML内でもng-includeをネストして使うことができるが、その場合のパス指定はどうなるか?
例えばファイルシステム上で
index.html
templates/template.html
templates/subtemplates/subtemplate.html
という位置関係になっているとする。
まずindex.htmlでtemplate.htmlを読み込むには「templates/template.html」と指定する。これは普通に納得がいくだろう。
次に、template.htmlでsubtemplate.htmlを読み込むにはどうするか?「subtemplates/subtemplate.html」ではない。「templates/subtemplates/subtemplate.html」だ。
つまり、「指定すべき相対パスは、あくまでコントローラーとなるファイルからのパスとなり、ファイルシステム上での位置関係とは無関係」ということなので注意したい。
コメント
コメントを投稿