AngularJS ng-include no incluye la vista a menos que se pase en $ scope

Question

¿Es incorrecto suponer que ngInclude puede tomar una ruta cruda? Sigo tratando de establecer mi ngInclude de la siguiente manera:

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

esto no funciona, pero si hago algo como esto lo hace el trabajo.

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

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

En mi index.html

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

¿El ngInclude valores solo, sin desconexión del alcance? Si es así, ¿por qué es así y no una recta del parcial html?

Answer 1

ng-include acepta una expresión. Si desea especificar la URL explícita directamente allí, debe dar una cadena.

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

Answer 2

ng-include, como otras directivas (ng-class, ng-src ...) evalúa una expresión angular del ámbito de aplicación. Sin comillas (''), buscará una variable del alcance.

---

Tenga en cuenta que no tiene que especificar el atributo src.

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

Puede ser rewritted a: (que es más simple)

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

---

también puede utilizar ng-incluir como elemento :

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