- templateUrl
Example: List people with directive and templateUrl
examples/angular/list_people_directive_url.html
<script src="angular.min.js"></script> <script src="list_people_directive_url.js"></script> <div ng-app="DemoApp" ng-controller="DemoController"> <div my-person person="p" ng-repeat="p in people"></div> </div> <style> .person { background: #EEE; margin: 20px; } </style
examples/angular/list_people_directive_url.js
angular.module('DemoApp', []); angular.module('DemoApp') .controller('DemoController', ['$scope', function($scope) { $scope.people = [ { name: 'Foo', email: 'foo@company.com' }, { name: 'Bar', email: 'bar@company.com' }, { name: 'Qux', email: 'qux@company.com' } ]; }]); angular.module('DemoApp') .directive('myPerson', function () { return { scope: { person: '=' }, replace: true, templateUrl: 'person.html' } });