CODEWITHSUNDEEP
angularjsappendangularjs-ng-click
Larkis
Larkis

Reputation: 67

Angular use ng-click in prepended html

i have this element in my html:

<div class='printOptionElements'></div>

and i want fill it dynamicly with ng-click-elements in my Controller.

$scope.printoptions = function() {
         $(".printOptionElements").append("<div class='printoption printhideelement' ng-click='printhide()'>Hide</div>");
    }
if (document.URL.indexOf("print=true") > 0) {
         $scope.printoptions();
}

$scope.printhide = function() {
        alert("hidetest");
    }

The printoption element will appear, but the ng-click will not work. I think that angular shows for ng-clicks before this ng-click is there. What can i do to "activate" the ng-click?

Thanks for help :)

Greetings Thomas

Upvotes: 1

Views: 61

Answers (1)

GPicazo
GPicazo

Reputation: 6676

You need to inject the $compile service into your controller and then compile the content against the controller's scope before appending it:

$scope.printoptions = function() {
        var content = "<div class='printoption printhideelement' ng-click='printhide()'>Hide</div>";

        $(".printOptionElements").append($compile(content)($scope));
    }

Upvotes: 3

Related Questions