Here is my html snippet :
<div ng-controller="ctrl"> <custom-tag title = "name" body = "content"> </custom-tag> </div>
Here is controller and directive written:
var mod = angular.module("main_module",[]); //Controller mod.controller("ctrl",function($scope) { $scope.name="Page Title"; $scope.content="sample_template.html"; }); //Directive mod.directive("customTag", function() { return { 'restrict' : 'E', 'scope' : { 'title' : '=', 'body : '=' }, 'templateUrl' : 'directive_template.html' }; });
<!-- directive_template.html --> <div> <div>{{title}}</div> <div ng-include="'{{body}}'"></div> </div>
The actual html rendered by directive is this :
<div> <div ng-binding></div> <!-- ngInclude: '{{body}}' --> </div>
Clearly it is not getting the directive scope variables from attributes in <custom_tag>
Please tell me why it is happening and how I resolve this issue. Thanks
Check the console for errors extra quotes and {{}} braces were breaking things.
<div> <div>{{title}}</div> <div ng-include="body"></div> </div>
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.