feat(core): shorthand for exposing model input/output pairs in hostDirectives #70748

@Directive({ selector: '[dir]' })
export class Dir {
  readonly value = model.required<number>();
}

@Component({
  selector: 'Comp',
  hostDirectives: [
    {
      directive: Dir,
      inputs: ['value: aliasedValue'],
      outputs: ['valueChange: aliasedValueChange'],
    },
  ],
  template: `
    <button (click)="value.set(value() - 1)">-</button>
    <span>{{ value() }}</span>
    <button (click)="value.set(value() + 1)">+</button>
  `,
})
export class Comp {
  protected readonly value = inject(Dir).value;
}

@Component({
  imports: [Comp],
  template: `
    <h3>Value: {{ v() }}</h3>
    <Comp [(aliasedValue)]="v" />
  `,
})
export class App {
  protected readonly v = signal(0);
}

hostDirectives: [
    { directive: Dir, models: ['value: aliasedValue'] },
]