2

I am trying to insert a node dynamically, but the appended html is not getting compiled correctly.

This is the code on Fiddle.

<body ng-app="app">
<div ng-controller="appController"> 
    {{tittle}}
   <div name="name" ng-repeat="d in data" ng-click="click(d.id)" id="div{{d.id}}">{{d.id}} click me</div>
</div>


(function () {
    var app = angular.module('app', []);
    app.controller('appController', function ($scope, $compile) {
        $scope.tittle = "test";
        $scope.data = [{ id: 1, child: [{name:'renjith'}] }, { id: 3 }, { id: 4 }, { id: 5 }, { id: 6 }];
        $scope.click = function (data, $element) {
            debugger;
            var scope = { id: "12" };
          angular.element(document.querySelector("#div" + data)).append($compile("<div ngTransclude>{{d.id}}</div>")($scope.data));
        }
    });
})();
Improve this question
7
  • Using this works angular.element(document.querySelector("#div" + data)).append($compile("<div ngTransclude>{{data[0].child[0].name}}</div>")($scope)); It seems in ur code, u are passing a array and there is no variable to access the array. So I pass in just the scope and the array can be access via 'data' property Commented Jan 7, 2016 at 5:12
  • 1
    you should pass a real $scope to $compile. You can create a new isolated scope though. Read this. Commented Jan 7, 2016 at 5:13
  • blessenm thank you but when i click next node it add the same data. i want to update data from server Commented Jan 7, 2016 at 5:18
  • y i cant get the ng-repeated data d in appended node? Commented Jan 7, 2016 at 5:26
  • 1
    You will only get what you pass in the compiled template. Here the id is accessible jsfiddle.net/cho31y5e/4 Commented Jan 7, 2016 at 6:05
Related questions
2941
Open a URL in a new tab (and not a new window)
987
Creating a new DOM element from an HTML string using built-in DOM methods or Prototype
0
Angular $document append not working when start call is from jQuery
Load 6 more related questions Show fewer related questions

0

Reset to default

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.