web-dev-qa-db-ja.com

AngularJS ng-includeは、$ scopeに渡されない限り、ビューを含みません

ngIncludeが生のパスを取ることができると仮定するのは間違っていますか？次のようにngIncludeを設定しようとしています。

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

これは機能しませんが、このようなことをすると機能します。

// HeaderController
app.controller('HeaderCtrl', function($scope){
   $scope.templates = {[
     template: { url: 'views/header.html' }
   ]};

   $scope.template = $scope.templates[0].template;
});

私のindex.htmlで

<div ng-controller="HeaderCtrl">
  <div ng-include src="template.url"></div>
</div>

ngIncludeは、スコープ外の値を除きますか？もしそうなら、なぜこれがこの方法であり、htmlパーシャルのストレートインクルードではありません。

angularjsangularjs-ng-include
121
Chad

ng-include は式を受け入れます。明示的なURLを直接指定する場合は、文字列を指定する必要があります。

<div ng-include src="'page.html'"></div>
327
Tosh

ng-include 、他のディレクティブとして（ ng-class 、 ng-src ...）はAngular式を評価スコープから。引用符（''）がなければ、スコープの変数を検索します。

src属性を指定する必要がないことに注意してください。

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

書き直すことができます：（that simpler）

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

Ng-includeを element として使用することもできます。

<ng-include src="'views/header.html'"></ng-include>
1
Mistalis