working not angularjs templates include partial

not - AngularJs incluye una plantilla parcial



ng-include angularjs (2)

Desde Angular 2 , se ha removed ngInclude y se prefieren las directivas personalizadas. Esta es la forma en que se me ocurre

  1. Define el componente principal de tu aplicación, que enlaza a la página maestra

    @View({ templateUrl: ''client/app/layout/main.html'', directives: [ROUTER_DIRECTIVES, Navigation, Footer] }) @Component({selector: ''app''}) @RouteConfig( routerConfig ) class MainComponent { }

Y esta es la plantilla principal

<!---- Navigation bar ----> <navigation></navigation> <!----/ Navigation bar ----> <!---- Main Part ----> <router-outlet> </router-outlet> <!----/ Main Part ----> <!---- Footer ----> <footer></footer> <!----/ Footer ---->

  1. Defina un base.html , que contendrá la etiqueta del cuerpo y la etiqueta de la aplicación

<body> <app>Loading ...</app> </body>

  1. Ahora, el último paso es definir los componentes para Navigation y Footer como MainComponent, que apuntan a sus plantillas parciales

Tengo esto en mi archivo de diseño principal

<body> <header id="header" ng-controller="HeaderController"></header> <div class="container" ng-view></div>

Tengo una plantilla parcial header.html en mi estructura de directorio.

¿Cómo incluir esta plantilla en mi aplicación? Pensé que angular automáticamente incluye la plantilla después de procesar el controlador, pero no funciona.

El nodo del encabezado debe reemplazarse por el contenido de este archivo.


Una forma de incluir plantillas / fragmentos html desde archivos externos es usar la directiva ng-include ( doc ).

<ng-include src="''/path/to/the/header.html''"></ng-include>

o

<div ng-include src="''/path/to/the/header.html''"></div>