I am currently attempting to create a child component that can pass parameters using a directive, but I have not been able to find any tutorials on how to achieve this yet.
I have tried looking at some resources, such as this one on Stack Overflow: Get reference to a directive used in a component
Below is a snippet of my code:
This is the template from the parent component:
<child-component>
<grand-child-directive [name]='Ghandy'></grand-child-directive >
<grand-child-directive [name]='Ani'></grand-child-directive >
<grand-child-directive [name]='Budi'></grand-child-directive >
</child-component>
This is the grand-child-directive directive:
@Directive({
selector: 'grand-child-directive ',
})
export class gc{
@Input() name:string;
}
This is my child-component:
@Component({
selector: 'child-component',
templateUrl: './child-component.component.html',
styleUrls: ['./child-component.component.scss'],
})
export class childComponent implements OnInit
@ViewChildren(gc) gc: gc;
constructor(
) {
}
ngOnInit() {
console.log(gc.name)
}
}
When I use console.log(gc.name), I get undefined instead of an array [Ghandy, Ani, Budi]. Any help would be greatly appreciated.