Выберите директиву динамически в AngularJS

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

<div class="{{field.type_desc}}"  ng-repeat="field in row.fields"></div>

а это код в контроллере

app.directive('Textbox', function($compile) {
return {
    restrict: 'C',
    link : function (scope,element)
    {
        formFieldTemplate= $('<input>').attr('type','password'); 
        $compile(formFieldTemplate)(scope); 
        var formListElement = $(element);
        formListElement.append(formFieldTemplate);
    }
}
})

После загрузки страницы я вижу в HTML нужный класс, но по-прежнему не вижу директивы.

Спасибо за помощь


person Sagiw    schedule 24.07.2013    source источник
comment
Это меня удивило. Я также пробовал это с вариантами ng-class, и это тоже не сработало.   -  person Sharondio    schedule 25.07.2013
comment
Я думал, это будет связано с тем, что ng-repeat является терминальным и имеет приоритет 1000, тогда как по умолчанию приоритет равен нулю. это означает, что ваша директива не должна срабатывать, потому что сначала идет ng-repeat и прерывает процесс компиляции (терминал). Я пробовал здесь, но он не работает plnkr.co/edit/IRFLfQKRcp1kxuvhGNdE/< а>   -  person Eduard Gamonal    schedule 25.07.2013
comment
Взгляните на это: stackoverflow.com/questions/14425497/   -  person Umur Kontacı    schedule 25.07.2013


Ответы (1)


Вам не хватает нескольких вещей для динамической генерации директив:

var myNewDirectiveScope = $scope.$new();
myNewDirectiveScope.myProperty = 'Some value';

var myDirective = $compile('<div my-directive-name my-property="myProperty"></div>');

var myDirectiveElement = myDirective(myNewDirectiveScope);

$(window.document.body).append(myDirectiveElement);

Итак, сначала я создаю новый прицел. Затем я присваиваю строку «Некоторое значение» свойству этой области.

Затем я предоставляю компиляцию с шаблоном строки с именем директивы и свойством, указывающим на myProperty, который находится в созданной вами области. Это возвращает функцию, которая после вызова с областью видимости вернет элемент, который вы действительно можете добавить на свою страницу.

Так что в вашем случае это может быть:

app.directive('Textbox', function($compile) {
return {
    restrict: 'C',
    link : function (scope,element)
    {
        var formFieldTemplate = '<input type="password" />';

        var directive = $compile(formFieldTemplate);

        var formListElement = directive(scope);

        formListElement.append(formFieldTemplate);
    }
}
})
person Jesse Earle    schedule 25.07.2013