2017-02-13 20 views
0

Вот мой HTML-код, где я звоню директиваAngularJS Пользовательская директива Как получить доступ к значению объекта?

<div ng-repeat="feat in templateAttributes track by $index"> 
       <md-input-container flex="50"> 
        <feat-directive feat="{{feat}}" /> 

       </md-input-container> 

</div> 

и ниже пользовательский код директивы

sureApp.directive('featDirective', function() { 
alert("Hariom"); 
    return { 

    restrict: 'E', 
    template: '<span style="padding-right:20px"><label value="{{feat.Name}}">{{feat.Name}}</label></span>', 
    link: function(scope, element, feat){ 

     if(feat.DataType === 'Boolean'){ 
      element.append('<input type="text" id="{{feat.Name}}" value="{{feat.Value}}" ng-model="feat.Value" />'); 
     } 
     else if(feat.AllowedValues && feat.AllowedValues.length > 0){ 
      element.append('<select ng-model="feat.Value" ng-options="x for x in feat.AllowedValues.split(\',\')"></select>'); 
     } 

     else if(feat.DataType == 'Integer'){ 
      element.append('<input type="text" id="{{feat.Name}}" value="{{feat.Value}}" ng-model="feat.Value" />'); 
     } 
     else if(feat.DataType == 'String'){ 
      element.append('<input type="text" id="{{attr.feat.Name}}" value="{{attr.feat.Value}}" ng-model="attr.feat.Value" ng-minlength="attr.feat.MinLength" ng-maxlength="attr.feat.MaxLength" />'); 
     } 
     else if(feat.DataType == 'IpAddress'){ 
      element.append('<input type="text" id="{{feat.Name}}" value="{{feat.Value}}" ng-model="feat.Value" />'); 
     } 

    } 
    };     

}); 

Но когда я пытаюсь получить значение feat.DataType я получаю undefined в то время как я становясь ниже значений при отладке кода.

$attr 
: 
Object 
feat 
: 
"{"Name":"DisplayName","DataType":"String","Description":"Display Name","Mandatory":true,"Editable":true,"Extension":false,"MinLength":3,"MaxLength":100,"AllowedValues":"","Value":""}" 
__proto__ 
: 
Object 

Тогда я изменить код немного как этот

link: function(scope, element, attr) 

и попытался б JSON парсер

var feat1 = JSON.parse(attr.feat); 

После этого изменения ниже код, показывающий {{feat.Value}} в InputBox

<input type="text" id="{{feat.Name}}" value="{{feat.Value}}" ng-model="feat.Value" /> 
+0

'ссылка: функция (объем, элемент, подвиг) {' это неправильный, третий аргумент - для атрибутов элемента, поэтому он должен быть: 'link: function (scope, element, attrs) {', а затем 'attrs.feat' – maurycy

+0

@maurycy Я тоже попробовал это, и у него есть значение' '{ «Имя»: «DisplayName», «DataType»: «String», «Description»: «Display N ame »,« Обязательный »: true,« Editable »: true,« Extension »: false,« MinLength »: 3,« MaxLength »: 100,« AllowedValues ​​»:« "," Value ":" "}" 'и при попытке 'access attr.feat.AllowedValues' его ближайшие неопределенные –

+0

просто измените' 'to' 'и вы должно быть хорошо – maurycy

ответ

1

Angul Директива arJS создает свою собственную scope, вы можете получить доступ к parent scope с помощью scope isolation

AngularJS docs for directive

Вы можете добавить scope недвижимость взамен

return { 
restrict: 'E', 
scope: { 
    feat: '=feat' 
} 
... 
} 
+0

если атрибут и значение сфера такие же, вам не нужно использовать имя только' подвиг: «=» ' – maurycy

+0

@maurycy Тогда как включить его любой предложение. –

+0

Я думаю, что вы можете 'try feat: '='' вместо 'feat: '= feat'', в строке с' = 'sign представлять' имя атрибута' в 'directive' –

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

  • Нет связанных вопросов^_^