CODEWITHSUNDEEP
javascriptangularjsdirectiveng-bind-html
user674905
user674905

Reputation: 19

using directive in ng-bind-html

Im trying to call a directive to change view based on my tab click.

My directive:

Proj.directive('tab1', function() {
    return {
        restrict:'E',
        templateUrl:'partials/overviewPage.html'
    };
});

and my controller:

$scope.selectTab = function(tab){
        if(tab == 'something'){
            $scope.content = '<tab1></tab1>';
        }
    }

and the div Im trying to change

<div ng-bind-html="content"></div>

Im trying to click on tab to show overviewPage.html page. But its not working properly.

Any suggestion, as I have just started with angularjs

Thanks.

Upvotes: 0

Views: 374

Answers (1)

pkozlowski.opensource
pkozlowski.opensource

Reputation: 117370

This won't work, ng-bind-html will just insert HTML into the DOM tree without triggering AngularJS directives to be processed.

If you want to insert "live" HTML into the DOM, where all the directives are "live" you would have to compile it first (http://docs.angularjs.org/api/ng.$compile) and then attach to the DOM tree. This is usually done in a directive.

Upvotes: 1

Related Questions