user944513 user944513 - 2 years ago 94
AngularJS Question

how to add transclude in angularjs

I am trying to add transclude property in angularjs .I am got getting error but still not able to implement the transclude property .I am not able to see both content outer and inner contend. I am not able to display both text "hello" and "this" simultaneously

here is my code

var app =angular.module('Testappp',[]);

return {


// templateUrl:'template/home.html',
transclude :true,
template:"<div ng-transclude>this</div>",



Answer Source

You can do it like so,

var app =angular.module('Testappp',[]);

app.directive('superMan', function () {

    return {
        restrict: "E",

        transclude: true,
          "<div>" + 
            "<div>this</div>" + 
            "<div ng-transclude></div>" +



Your example does not work because as said in documentation about ngTransclude

Directive that marks the insertion point for the transcluded DOM of the nearest parent directive that uses transclusion. Any existing content of the element that this directive is placed on will be removed before the transcluded content is inserted.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download