2016-07-28 6 views
0
소요

나는 다음과 같이 보이는 지시어가 다음 directives 속성이 추가 속성 정보를 추가하는 문자열이라고각도 래퍼 구성 요소는 추가 지시

.directive('textInput', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    transclude: false, 
    compile: function(element, attrs) { 
     var html = 
     '<div class="form-group">' + 
     '<label>{{ \'' + attrs.label + '\' | translate }}</label>' + 
     '<input type="text" class="form-control input-sm" placeholder="' + attrs.placeholder + 
     '" ng-model="' + attrs.ngModel + '"' + attrs.directives + '>' + 
     '</div>'; 

     var newElem = $(html); 
     element.replaceWith(newElem); 

     return function (scope, element, attrs, controller) { }; 
    } 
    }; 
}) 

주 (예 : 툴팁 정보)

I을 1.5 component으로 변환되었지만 directives 정의와 동일한 작업을 수행 할 수 없습니다.

.component('textInput', { 
    bindings: { 
    label: '@', 
    placeholder: '@', 
    directives: '<', 
    ngModel: '=' 
    }, 
    require: { 
    ngModelCtrl: 'ngModel' 
    }, 
    template: 
    '<div class="form-group">' + 
     '<label ng-if="$ctrl.label">{{$ctrl.label | translate }}</label>' + 
     '<input' + 
     ' type="text"' + 
     ' class="form-control input-sm"' + 
     ' placeholder="{{$ctrl.placeholder}}"' + 
     ' ng-model="$ctrl.ngModel"' + 
     ' {{$ctrl.directives}}>' + 
    '</div>' 
}) 

<text-input directives="tooltip='foobar'"></text-input> 
내가 기본 템플릿이 올바른 정보를 얻을 수 있도록 <text-input/> 요소에 문자열에 전달할 수있는 방법

?

답변

0

그것은, : 워드 프로세서에 따라 수 없습니다

구성 요소 사용하지

: 등 이벤트 리스너 를 추가, DOM 조작에 의존하는 지시에 대한

를 컴파일 및 링크 때문에 함수가 사용할 수없는 경우 속성 또는 CSS 클래스에 의해 트리거되는 지시문을 요소가 아닌

으로 트리거하려는 경우 priority, terminal, 다중 요소와 같은 고급 지시문 정의 옵션이 필요할 때 사용할 수 없습니다.

같은 페이지에서 구성 요소에는 compile 기능이 없다고 말합니다.