Операции AngularJS с атрибутами директивы

Небольшой вопрос. Я не могу найти решениеОперации AngularJS с атрибутами директивы

У меня есть некоторые директивы, которые мне нужно вставлять в мои теги в некоторых случаях.

Моя форма объекта

function AppCtrl($scope) { 

    $scope.form ={ 
     name:{ 
      type: 'text', 
      validate: 'letters' 
     }, 
     tel:{ 
      type: 'number', 
      validate: 'digits' 
     } 
    } 
}

Моя директива

<body ng-app ng-controller="AppCtrl"> 
<input type="{{v.type}}" placeholder="{{k}}" {{v.type=='number' ? 'string-to-number' : '' }} {{v.validate}} value="" ng-repeat="(k,v) in form"> 
</body>

мне нужно сделать 'Подтвердить' и 'строка-число' atributes в входов. Но мой код не срабатывает

Вот jsfiddle пример http://jsfiddle.net/FxM3B/517/

источник

2015-08-21 Sergey Kudryashov

Вы не можете добавить HTML атрибут таким образом, вы должны взглянуть на нг-ATTR, но вы, возможно, потребуется изменить директиву потому что он добавляет атрибут во всех случаях, только контент является динамическим.

В противном случае эта статья объясняющие несколько решений: http://www.thinkingmedia.ca/2015/03/conditionally-add-a-html-element-attribute-value-in-angularjs/

источник

2015-08-21 08:44:15 ThibaudL

Я обновил plunker with a possible solution

<div ng-repeat="(k,v) in form"> 

<input ng-if="v.type ==='number'" type="{{v.type}}" placeholder="{{k}}" validate="{{v.validate}}" value="" string-to-number> 
    <input ng-if="v.type !=='number'" type="{{v.type}}" placeholder="{{k}}" validate="{{v.validate}}" value=""> 
    </div>

Проверка с нг-если значение и добавить разметку для двух вариантов.

источник

2015-08-21 08:53:24 Raulucco

Не очень ellegant, но работает. Thanx –

Поскольку имена атрибутов, которые вы хотите добавить в элемент, являются значениями свойств вашей модели, вы не можете использовать директиву ng-attr. Вы можете написать свою собственную директиву, которая обрабатывает такие ситуации. Вот jsfiddle example

.directive('boolAttrs', function(){ 
    return function(scope, element, attrs){ 

     var propExpr = attrs['boolAttrs']; 

     if (propExpr) 
     { 
      var data = angular.fromJson(propExpr); 

      if (angular.isArray(data) && data.length > 0) { 

       angular.forEach(data, function (value, index, array) { 

        var propValue = scope.$eval(value); 

        if (angular.isFunction(propValue)) 
         propValue = propValue(); 

        if (propValue) 
         element.attr(propValue, ""); 
       }); 
      } 
     } 
    }; 
})

Вы можете применить эту директиву следующим образом:

bool-attrs='["v.validate", "v.type == \"number\" ? \"string-to-number\" : \"\" "]'

значение для BOOL-ATTRS должна быть правильной строкой JSON массив, который определяет выражения evaluete, чтобы определить имена атрибутов для вставки.

источник

2015-08-21 11:09:38 Rustam

Операции AngularJS с атрибутами директивы

ответ

Смежные вопросы