2017-09-12 10 views
1

에 @ContentChild으로 내가 가지고있는 폼이 같은 컨트롤 :를 주입 AbstractControlDirective 인스턴스 정의 지시어

<input formControlName="myName" dynamicDisable> 

그런 다음 사용자 정의 지시어 :

@Directive({ 
    selector: '[formControlName][dynamicDisable] 
}) 
export class DynamicDisableDirective implements AfterContentInit { 

     @ContentChild(AbstractControlDirective) control: any; 

     ngAfterContentInit(): void { 
     console.log(this.control); 
     } 
    } 

이 나는대로 지시어 소유자 요소를 삽입하고 싶습니다 @ ContentChild를 지시문에 추가합니다. 소유자 요소는 간단한 FormControl, FormGroup 또는 심지어 FormArray와 같은 모든 유형의 양식 컨트롤이 될 수 있습니다. FormControlName은 AbstractControlDirective의 자손입니다. 콘솔이 항상 '정의되지 않음'을 기록하는 이유는 무엇입니까?

참고 :이 같은 NgControl에 대한 AbstractControlDirective을 전환 할 때 예상대로

@ContentChild(NgControl) control: any; 

모든 작품, 폼 컨트롤의 인스턴스가 주입도 기록됩니다. 그러나이 접근법은 그룹 및 배열이 아닌 단순한 FormControl에만 사용할 수 있습니다.

답변

0

내가 아는 한 AbstractControlDirective으로 제공되는 것이 없으므로 더 이상 도움을 얻지 않고도 쿼리하거나 삽입 할 수 없습니다.

나는 시도하지 않은,하지만 더 이상있을 경우이 목록을 얻으려면, 당신은 (모두에게) 할 수 있습니다 useMulti: true으로

@Directive({ 
    selector: '[formControlName][dynamicDisable], 
    providers: [ 
    { provide: AbstractControlDirective, useExisting: FormControl, useMulti: true }, 
    { provide: AbstractControlDirective, useExisting: FormGroup, useMulti: true }, 
    ] 
}) 

같은 별칭 공급자를 등록하는 작업을 생각하고 일치시켜야하고 실제로 원하는 것을 목록에서 필터링하십시오.

+0

이처럼 AbstractControlDirective를 제공하면 다음 오류가 발생합니다. 'core.es5.js : 1020 오류 : 캐치되지 않음 (약속 있음) : 오류 : FormGroup에 대한 공급자가 없습니다!' – witcher

+0

알 수 있습니다. 그러면'useMulti'를 사용해야합니다. –

+0

사실 이것이 작동하는지 잘 모르겠습니다. 이 접근법은 https://stackoverflow.com/questions/39366869/viewchildren-passing-multiple-components/39366891#39366891에서 왔습니다. 또 다른 접근법은 (구체적인 클래스를 사용하여) 각각을 주입하거나 질의하고 어떤 것이 발견되었는지를 확인하는 것입니다. –