发表新帖
发表新帖

AngularJs Include Partial Template

前端 未结
关注
2 1879
悲哀的现实
悲哀的现实 2020-12-04 21:26

I\'ve this in my main layout file


    

    


        

                      

              相关标签:
2条回答
  • Happy的楠姐
    2020-12-04 21:35

    One way of including templates/html fragments from external files is to use the ng-include directive (doc).

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

    or

    <div ng-include src="'/path/to/the/header.html'"></div>
    0 讨论(0)
  • 陌清茗
    2020-12-04 21:35

    From Angular 2, ngInclude has been removed and custom directives are preferred. This is the way I come up with

    1. Define the main component for your app, which link to the master page 

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

    And this is the main template 

    <!---- Navigation bar ---->
<navigation></navigation>
<!----/ Navigation bar ---->

<!---- Main Part ---->
<router-outlet>
</router-outlet>
<!----/ Main Part ---->

<!---- Footer ---->
<footer></footer>
<!----/ Footer ---->
    1. Define a base.html, which will contain the body tag and the app tag

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

    1. Now, final step is defining the components for Navigation and Footer like the MainComponent, which point to your partial templates
    0 讨论(0)
 看不清?
提交回复
热议问题