4

I tried to look at documentation but it seems i am missing something. I am trying to inject html which is bound to a json. It works fine if the html is declared but when i inject it despite calling the $compile it is not working. Here is the code

<!DOCTYPE html>
<html ng-app>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js">        </script>
 <script src="todo.js"></script>
<script> 

 function TodoCtrl($scope)
  {
  $scope.todos = [{text:'LearnAngularJS'}, {text:'Unlearn Angular'},];
 }

 $(document).ready(function()
 {
 $('#div1').html(
$compile('<div ng-controller="TodoCtrl"><ul><li ng-repeat="todo in todos"    compile="text">{{todo.text}}<li><ul><div>')(scope));
 });

 </script>
</head>
<body>
<div ng-controller="TodoCtrl">
<ul>
 <li ng-repeat="todo in todos">
  {{todo.text}}
   <li>
  <ul>
   </div>

 <div id="div1">
 <div>

 </body>
 </html>
1
  • from where did u get (scope) value it would be undefined on the position where u have declared it Commented Apr 24, 2013 at 7:36

1 Answer 1

4

http://plnkr.co/edit/NQQBgQKBWEqKHxGwnI0h?p=preview

As Ajay pointed out, you'll have to associate one of your scope with template.

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

3 Comments

I tried to follow your logic and set scope like: plnkr.co/edit/VJd730r20qVupdMv137v but it seems to be missing something again
I tried to clean up and fixed some mistakes in your code: plnkr.co/edit/HhleQICxCpZ7LctMl8Dn?p=preview
Tosh - i am sorry for being so dummy! Thank you for enlightening me!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.