2016-04-20 13 views
0

Я пытаюсь создать директиву «имя», которая может содержать как имя, так и фамилию.angularjs dynamic templateurl values ​​

код я в настоящее время является:

index.html

<div data-dm-name label="First Name:" info="first_name"></div> 
<div data-dm-name label="Last Name:" info="last_name"></div> 

директива:

angular 
    .module('app.names.directive',[]) 
    .directive('dmName', [ directive ]) 

function directive() { 
    return { 
     restrict: 'E', 
     scope: { 
      label: '=', 
      info: '=' 
     }, 
     templateUrl: '/assets/components/name_template.html' 
    }; 
} 

name_template.html

<div class="wizard-form-group"> 
    <div class="input-group"> 
     <label class="wizard-form-label" for="info"> 
      {{ label }} 
     </label> 
     <span class="input-field" 
       data-ng-class="{ 
        error: form.info.$dirty && 
         form.info.$invalid, 
        focused: form.info.$focused 
       }" 
      > 
      <input 
       type="text" 
       name="info" 
       id="info" 
       data-ng-model="info" 
       data-ng-required="true" 
       data-ng-focus="form.info.$focused = true" 
       data-ng-blur="form.info.$focused = false" 
      /> 
     </span> 
    </div> 
</div> 

Моя проблема заключается в том, что я дон Кажется, передать значения для метки и информации в файл шаблона. Что я делаю не так?

Я только что начал использовать угловые, поэтому, надеюсь, это простое решение.

Заранее спасибо

+0

может помочь вам http://stackoverflow.com/questions/24918038/angularjs-directive-pass-parameters-through-templateurl-function –

ответ

1

в вашей функции директивного добавить функцию ссылки

function directive() { 
return { 
    restrict: 'EA', 
    scope: { 
     label: '=', 
     info: '=' 
    }, 
    templateUrl: '/assets/components/name_template.html', 
    link : function($scope, element, attrs){ 
     if(attrs.label){ 
     $scope.label = attrs.label 
     } 
     if(attrs.info){ 
     $scope.info = attrs.info 
     } 
    } 
    }; 
} 
+0

Это работало с небольшая настройка. Ошибка была выбрана из-за метки attirbute «Имя:» После изменения этого на «Первое» и добавления «Имя:» в шаблоне имени я получил это для работы. – JordanC

+0

О, извините, я не тестировал его на jsfiddle. Получил ленивый;) –

0

Ваша директива ограничен к элементу, но вы используете его в качестве атрибута. Таким образом, вы являетесь директивой, не действующей на элемент.

Вы должны изменить DDO к:

function directive() { 
    return { 
    restrict: 'A', // attribute allowed 
    scope: { 
     label: '=', 
     info: '=' 
    }, 
    templateUrl: '/assets/components/name_template.html' 
    }; 
}