This article mainly introduces the angularjs ng-include directive.Here is a detailed introduction to the knowledge of the ng-include directive.Have

angularjs ng-include directive

angularjs example

Include html file:

<! Doctype html>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<body ng-app="">
<div ng-include="" myfile.htm ""></div>

operation result:

myfile.htm file title

This text comes from the included file myfile.htm!

Definition and usage

The ng-include directive is used to include external html files.

The contained content will be the children of the specified element.

The value of the ng-include attribute can be an expression,Returns a file name.

by default,The included files need to be included under the same domain name.


<element ng-include="filename" onload="expression" autoscroll="expression"></element>

The ng-include directive is used as an element:

<ng-include src="filename" onload="expression" autoscroll="expression"></ng-include>

All html elements support this directive.

Parameter value

value description
filename File name. You can use an expression to return the file name.
onload Optional, the expression to be executed after the file is loaded.
autoscroll Optional, whether the contained part is scrollable on the specified view.

  • Previous Source code interpretation browser compatible module support in jQ
  • Next Example of simple percentage progress bar effect implemented by jQuery