Using Angular 15+ hostDirectives, how can I bind to inputs of the directive?
Note that I don't want to forward directive inputs to the host component, making them inputs of the component. I want to bind an expression to one of the directive inputs.
@Directive({
standalone: true,
})
class MyDirective {
@Input()
directiveInput?: string;
}
@Component({
hostDirectives: [ MyDirective ],
host: {
'[directiveInput]': 'inputValue' // This won't work, even if `directiveInput` is defined in the inputs of host directive definition object.
}
})
class MyComponent {
inputValue: string;
}
I sure can inject the directive, and assign the input manually in ngOnInit. But:
- It would be nicer to avoid imperative assignment of the input, and have the same declarative way of binding to inputs, regardless of directive being used in template or in hostDirectives
- If the value is not static but an expression, one needs to update the directive input every time the result of the expression is changed.