Estoy trabajando en una aplicación Angular que utiliza el componente p-autoComplete de PrimeNG. Quiero activar una alerta cuando el elemento obtiene el foco para indicar que el focus está en el elemento, pero no funciona. Estoy utilizando una directiva para lograrlo y me gustaría saber si alguien tiene una solución. Aquí está parte de mi código:
<p-autoComplete #autocomplete orlyDisableShortcuts class="autocomplete-custom" field="label"
[(ngModel)]="selectedSearchItem"
[suggestions]="suggestionsList" [minLength]="3" [delay]="500" [showClear]="true" [group]="true"
(completeMethod)="searchAutocomplete($event)" (onSelect)="redirectToPage($event)"
(onHide)="onAutoCompleteClose()" (onClear)="clearAutocomplete();autocomplete.hide()"
(onFocus)="onAutocompleteFocus();" (onBlur)="onAutocompleteBlur();">
</p-autoComplete>
Codigo de la directiva:
export class DisableShortcutsDirective implements OnDestroy {
constructor(private shortcutService: ShortcutService) { }
@HostListener('focus', ['$event.target'])
onFocus(): void {
console.log('Focus detected: Disabling shortcuts');
this.shortcutService.disableShortcuts();
}
@HostListener('blur', ['$event.target'])
onBlur(): void {
console.log('Blur detected: Enabling shortcuts');
this.shortcutService.enableShortcuts();
}
ngOnDestroy(): void {
this.shortcutService.enableShortcuts();
}
}
Alguien tiene una idea?