угловой, в директиве, добавляя к шаблону элемент с ng моделью

Question

Я пытаюсь добавить элемент ввода с ng-моделью внутри директивы.

my code

функция ссылка моей директивы:

link: function (scope, element, attrs) { 
     var elem_0 = angular.element(element.children()[0]); 
     for (var i in scope.animals[0]) { 
      elem_0.append(angular.element('<span>' + scope.animals[0][i].id + '</span>')); 

      //this part doesn't work 
      var a_input = angular.element('<input type="text">'); 
      a_input.attr('ng-model', 'animals[0][' + i + '].name'); 
      //end 
      elem_0.append(a_input); 
     } 

, кажется, мне нужно позвонить $ компилировать() в конце, но понятия не имею, как это сделать.

Answer 1

Попробуйте

var a_input = angular.element($compile('<input type="text" ng-model="animals[0][' + i + '].name"/>')($scope)) 
elem_0.append(a_input); 

Answer 2

Вы делаете директиву более сложным, чем это необходимо вручную обработке массивов, когда вы могли бы использовать вложенную ng-repeat в шаблоне директивы и пусть Угловая сделать массив петли:

angular.module("myApp", []) 
    .directive("myDirective", function() { 
    return { 
     restrict: 'EA',  
     replace: true, 
     scope: { 
      animals: '=animals' 
     }, 
     template: '<div ng-repeat="group in animals">'+ 
         '<span ng-repeat="animal in group">{{animal.id}}'+ 
          '<input type="text" ng-model="animal.name"/>'+ 
         '</span><hr>'+ 
        '</div>' 

    } 
}); 

DEMO: http://jsfiddle.net/Ajsy7/2/