Как добавить атрибуты к дочернему элементу в директиве

У меня есть следующий plunkr:

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

Я хочу сделать следующее: я хотел бы создать угловой код для автоматической генерации входных данных внутри формы, учитывая json с его описанием EXAMPLE:

{'name': 'username', 'description': ['text', 'maxlength=16', 'required']}

Для этого я использую пользовательскую директиву, которая добавляет ввод к тегу

<custominput></custominput>

Повороты

<custominput>
   <input type='text'/>
</custominput>

и ТО я добавляю любые другие атрибуты проверки, такие как minlength и maxlength.

В моем plunkr я могу добавить атрибуты к тегу custominput, например:

<custominput compiled="compiled" disabled="disabled"></custominput>

Но КАК я могу добавить эти атрибуты во входной тег (что означает дочерний элемент custominput)??

ОБНОВЛЕНИЕ 1

Этот вопрос можно обобщить так:

Как я могу добавить элемент / атрибуты HTML с угловыми директивами ОТ директивы

ПРИМЕР: включите это

<form name="form0">
    <input custom-directive>
</form>

в это:

<form name="form0">
    <input custom-directive type="text" ng-model="ctrl.username" ng-maxlength="15" ng-required="required">
</form>

из директивы

1 ответ

Вы бы добавили их в раздел шаблона директивы. Смотрите код ниже:

HTML-код

<form>
    <input custom-directive>
</form>

код директивы (я просто пишу это с головы до головы, вероятно, это не будет работа по копированию и вставке, но она определенно идет в правильном направлении).

app.directive('customDirective', function() {
  return {
    restrict: 'A',
    controller: function($scope, attrService) {
      $scope.attributes = attrService.getAttrs;
    },
    link: function(scope, element, attrs) {
      element.attr('name', scope.attributes.name);
      // add more attributes
      console.log(scope.attributes) // ensure attributes is being pushed through from directive controller.
    }
  }
});

Для динамического добавления атрибутов

Другие вопросы по тегам