How to compile using scope variables using directives

Question

I have the following code inside my directive.

scope.value = 5;
alert(scope.value);
var compiled = $compile("<div><h1>{{value}}</h1></div>")(scope);
alert(compiled[0].outerHTML)

The first alert value is 5, however, the second one shows...

<div><h1>{{value}}</h1></div>

How do I get it to recognize the value?

Vahan · Accepted Answer · 2014-08-12 21:00:19Z

1

I think alert stops executing so js did not compiled yet.

See this http://plnkr.co/edit/iaJsO8qPk1Knoh1mXRjy?p=preview

setTimeout(function(){
   alert(compiled[0].outerHTML);
 },100);

I added timeout to alert compile so I can see the needle html.

Do console.log(compiled[0].outerHTML);

answered Aug 12, 2014 at 21:00

Vahan

5341 gold badge7 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jackie Over a year ago

I had the same problem with the angular UI modal (dialogService.openModal(compiled[0].outerHTML);) which is what I was really trying to solve. This seems a little hacky (is it really pausing for 100 milliseconds?) but worked great! Thanks!

Collectives™ on Stack Overflow

How to compile using scope variables using directives

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related