How can i access my directive attached to the cchild omponent when calling

Asked Jul 20 '21 at 13:23

Active Jul 20 '21 at 13:23

Viewed 37 times

I have child component in my App Component. To that child component i have attached one directive.

<app-complete  autoCompletion #custom="autoCompletion"  [autocompleteOptions]="autocompleteOptions" (optionSelected)="addChip($event)"></app-complete>

@Directive({
  selector: '[autoCompletion]',
  exportAs: 'autoCompletion'
})
export class AutoCompleteDirective {
    @Input() autoCompletion;
}

If i want to access that directive in my App component then i will do

app.component.ts


  @ViewChild('custom') custom: ElementRef;
  
  ngAfterViewInit() {
    console.log('custom', this.custom);
  }

but i can't find a way to do this directly in my child component.

I tried in app.complete.ts file

@ViewChild('custom') custom: ElementRef;
  
  ngAfterViewInit() {
    console.log('custom', this.custom);
  }

but i get printed undefined

asked Jul 20 '21 at 13:23

peco123

Have you added `directives:[autoCompletion],` in your `app.component.ts` ? – Alireza Ahmadi Jul 20 '21 at 13:38
I have my directive added only in `app.module.ts` file so it is global. – peco123 Jul 20 '21 at 13:42
Also , i can't add `directives` in component decorator – peco123 Jul 20 '21 at 13:43
See this. https://stackoverflow.com/questions/36345618/get-reference-to-a-directive-used-in-a-component – Alireza Ahmadi Jul 20 '21 at 13:45
I mean this one: `@Component({ selector: 'my-app', directives:[MyCustomDirective], ... })` – Alireza Ahmadi Jul 20 '21 at 13:46
No, i can't add `directives` like that, try it also, there will be error – peco123 Jul 20 '21 at 14:05

How can i access my directive attached to the cchild omponent when calling

0 Answers0