Directive input binding when using Angular HostDirectives

Question

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.

Answer 1

I'll quote one of the member of the angular team here:

The composing directive can not provide values to host directive inputs.