Which @angular/* package(s) are relevant/related to the feature request?

compiler

Description

Currently, when a directive or a component use @Attribute to retrieve an attribute value from a host element, for example:

@Directive({
  selector: '[dir]',
})
export class Dir {
  constructor(@Attribute('priority') priority: string) {
    console.log(priority);
  }
}

The app will run with no errors when a value is defined statically in a component's template:

<img src="./test.png" dir priority="true" />

However when a binding is used:

<img src="./test.png" dir [priority]="true" />

the framework throws an error:

Can't bind to 'priority' since it isn't a known property of 'img'.

which is also correct, but we could improve the error message to include more info, for example:

Can't bind to 'priority' since it isn't a known property of 'img'.
Did you mean to bind to the priority @Attribute? Try XYZ.

(proposed by Kara in #45757 (comment))