Как добавить динамический div в AngularJS?

Question

.directive('mydirective', [function($scope, $document,windowService) { 
return{ 
    link : function(scope,element,attars){ 
     --- Some more code —-- 

     var containers = $('.container’); 
     containers.bind('click', function(event) { 
      var elem = event.currentTarget; 
      elem.append('<div>test</div>’); //Appending is failing 
     }); 
    } 
}]); 

TypeError: 'undefined' is not a function (evaluating 'elem.append('<div>test</div>')')  

Я только начинаю с AngularJS и придерживается вышеуказанной проблемы, я пытаюсь добавить div в контейнер.

Answer 1

Try с этим

containers.bind('click', function (event) { 
     var elem = event.currentTarget; 
     $(elem).append('<div>test</div>’); //Appending should work 
} 

как elem может быть объектом ввода HTML вы должны преобразовать его в объект JQuery использовать .append() метод JQuery! так что оберните свой elem переменный arround $(). Он должен работать

Answer 2

Лучше использовать это. Удаляет зависимость от JQuery, поскольку угловое ядро ​​использует JQLite. Это в основном то же самое, что и происходит. https://docs.angularjs.org/api/ng/function/angular.element

containers.bind('click', function (event) { 
     var elem = event.currentTarget; 
     angular.element(elem).append('<div>test</div>’); //Appending should work 
}