2

두 개의 지시문이 있으며 각각 ng-repeat의 결과로 하나씩 선택하고 싶습니다.지시어를 Angular에서 동적으로 선택

<div class="{{field.type_desc}}" ng-repeat="field in row.fields"></div> 

는이 컨트롤러 I는 HTML 올바른 클래스에서 볼 수있는 페이지로드 후

app.directive('Textbox', function($compile) { 
return { 
    restrict: 'C', 
    link : function (scope,element) 
    { 
     formFieldTemplate= $('<input>').attr('type','password'); 
     $compile(formFieldTemplate)(scope); 
     var formListElement = $(element); 
     formListElement.append(formFieldTemplate); 
    } 
} 
}) 

의 코드이지만, 여전히 나는 지시어를 볼 수 없습니다.

당신은 지시의 동적 생성을위한 몇 가지 누락 당신의 도움이

+0

이 하나가 나를 놀라게했다. 나는 또한 ng-class의 변형으로 시도했지만 어느 것도 작동하지 않았다. – Sharondio

+0

ng-repeat가 터미널이고 우선 순위가 1000 인 것과 관련이 있다고 생각했지만 기본적으로 우선 순위는 0입니다. 즉, ng-repeat가 먼저 실행되고 컴파일 프로세스 (터미널)가 중단되므로 지시문이 트리거되지 않아야합니다. 나는 그것을 시도했지만 작동하지 않습니다 http://plnkr.co/edit/IRFLfQKRcp1kxuvhGNdE?p=preview –

+0

이것 좀보세요 : http://stackoverflow.com/questions/14425497/angularjs-ngrepeat-with-multiple -object-types/14425547 # 14425547 –

답변

0

주셔서 감사합니다 :

var myNewDirectiveScope = $scope.$new(); 
myNewDirectiveScope.myProperty = 'Some value'; 

var myDirective = $compile('<div my-directive-name my-property="myProperty"></div>'); 

var myDirectiveElement = myDirective(myNewDirectiveScope); 

$(window.document.body).append(myDirectiveElement); 

을 그래서 처음에는 새로운 범위를 만드는거야. 그런 다음 해당 범위의 속성에 'Some value'문자열을 할당합니다.

그런 다음 지시문의 이름과 만든 범위에있는 myProperty를 가리키는 속성이있는 문자열 템플릿을 사용하여 컴파일하십시오. 이렇게하면 한 번 범위에서 호출 한 함수가 실제로 페이지에 추가 할 수있는 요소를 반환합니다.

그래서 귀하의 경우에는 다음과 같을 수 있습니다

app.directive('Textbox', function($compile) { 
return { 
    restrict: 'C', 
    link : function (scope,element) 
    { 
     var formFieldTemplate = '<input type="password" />'; 

     var directive = $compile(formFieldTemplate); 

     var formListElement = directive(scope); 

     formListElement.append(formFieldTemplate); 
    } 
} 
}) 
관련 문제