ng-include
Description
Use ng-include to fetch, compile, and include an external HTML fragment into your current application.
The URL of the template is restricted to the same domain.
Example
The following code shows how to ng-include.
<!-- www .j a v a2s .c o m-->
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
</head>
<body>
<div ng-app>
<script type="text/ng-template" id="/tpl.html">
I am from a template.
</script>
<ng-include src="'/tpl.html'"></ng-include>
</div>
</body>
</html>
ng-include creates a new child scope.
To use a particular scope, invoke the ng-controller="YourController" directive on the same DOM element.
<div ng-include="/myTemplateName.html"
ng-controller="MyController"
ng-init="name = 'World'">
Hello {{ name }}
</div>