typescript - Llamar a función fuera del componente de directiva de Angular
¿Hay alguna manera de llamar a una función en mi directiva, pero fuera del componente?
Ejemplo :
<ion-input #bar barcodeScanner></ion-input>
<button (click)="bar.start()" type="button">
<i class="my-icons-scaner"></i>
</button>
Directiva:
@Directive({
selector: '[barcodeScanner]'
})
export class BarcodeScannerDirective implements OnInit {
constructor(private _element: ElementRef) {}
ngOnInit() {
const element = this._element.nativeElement
console.log({ element })
}
public start(){
console.log('start?')
}
}
Respuesta #1
Usa la propiedad exportAs en el decorador Directive así
Define el nombre que se puede usar en la plantilla para asignar esta directiva a una variable.
directiva.ts
@Directive({
selector: '[barcodeScanner]',
exportAs: 'barcodeScanner'
})
Luego podemos acceder a nuestra instancia de barcodeScanner en cualquier parte de nuestra plantilla:
<ion-input #bar="barcodeScanner" barcodeScanner></ion-input>
<button (click)="bar.start()" type="button">
<i class="my-icons-scaner"></i>
</button>
