简体   繁体   中英

How the right way to use ng-include

I'm beginner on Angular.js and am having some problems with the directive ng-include .

I want to display contents of header.html inside index.html

Well, here's my tree example:

myapp
.    public
.    .     lib
.    .     .  angular.js
.    .     .  
.    header.html
.    index.html

Header.html code:

<h1>Hello Angular</h1>

Index.html code:

<html ng-app>
  <head> 
    <meta charset="utf-8">
    <script src="public/lib/angular.js"></script> 
  </head> 
  <body>  
    <ng-include src="'header.html'"></ng-include> 
  </body>   
</html>

When i run index.html , i have something like this:

<!-- ngInclude: undefined -->

I'm not sure if there's an ng-include tag to include other templates. We usually do it this way

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

Are you accessing the app through a web server or by accessing the file through file:// protocol? In the latter case it won't work due to browser's security restrictions. The solution would be to install Apache or Nginx and access the app through something like http://localhost/myapp/index.html .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM