I have a few simple helper directives which I want to use throughout the entire app. With modules this was easy to do, but with standalone I don't know how we can do it.
One example of such a simple helper directive is:
@Directive({
selector: '[click]',
standalone: true,
host: {
class: 'on-click',
tabindex: '0',
},
})
export class ClickEventDirective {}
Every single component in the app that uses a (click)="clickHandler()"
somewhere should have this applied.
I was thinking of something like this, but it should trickle down to all child components.
@Component({
selector: 'app',
template: `
<router-outlet />
`,
standalone: true,
imports: [
ClickEventDirective,
...
],
})