CODEWITHSUNDEEP
javascriptangularjs
basickarl
basickarl

Reputation: 40444

AngularJS not compiling html

$scope.message = '<p>test text</p>';
var html = '<div>{{::message}}</div>';

$scope.$apply(function () {
    $compile(html)($scope, function (cloned, scope) {
        $compile(cloned)(scope, function (clonedTwo, scopeTwo) {
            angular.element(myDiv).append(clonedTwo);
        });
    });
});

This results in a div element showing the following:

enter image description here

I realize that when I compile it it does it correctly. However when I try and compile it a second time it has no effect.

To fix this I need to compile the template and return raw html then use that html in the second compile.

Is there a method in angular which just renders plain html?

Upvotes: 0

Views: 116

Answers (1)

basickarl
basickarl

Reputation: 40444

The method I was looking for was $interpolate.

$scope.message = '<p>test text</p>';
var html = '<div>{{::message}}</div>';

var inter = $interpolate(html)($scope);

$scope.$apply(function () {
    $compile(inter)($scope, function (cloned, scope) {
        angular.element(myDiv).append(cloned);
    });
});

Upvotes: 2

Related Questions