Come si rileva un evento onBlur in Angular2? voglio usare conCome utilizzare l'evento onBlur su Angular2?
<input type="text">
Qualcuno può aiutarmi a capire come usarlo?
Come si rileva un evento onBlur in Angular2? voglio usare conCome utilizzare l'evento onBlur su Angular2?
<input type="text">
Qualcuno può aiutarmi a capire come usarlo?
Utilizzare (eventName)
per l'evento di associazione al DOM, in pratica ()
viene utilizzato per il binding di eventi. Utilizzare anche ngModel
per ottenere il bind a due vie per la variabile myModel
.
Markup
<input type="text" [(ngModel)]="myModel" (blur)="onBlurMethod()">
Codice
export class AppComponent {
myModel: any;
constructor(){
this.myModel = '123';
}
onBlurMethod(){
alert(this.myModel)
}
}
alternativa (non è preferibile)
<input type="text" #input (blur)="onBlurMethod($event.target.value)">
Per il modello guidato forma al fuoco convalida blur
, potreste passare updateOn
parametro.
ctrl = new FormControl('', {
debounce: 1000,
updateOn: 'blur', //default will be change
validators: [Validators.required]
});
/*for reich text editor */
public options: Object = {
charCounterCount: true,
height: 300,
inlineMode: false,
toolbarFixed: false,
fontFamilySelection: true,
fontSizeSelection: true,
paragraphFormatSelection: true,
events: {
'froalaEditor.blur': (e, editor) => { this.handleContentChange(editor.html.get()); }}
Questa è la soluzione proposta sul repo Github:
// example without validators
const c = new FormControl('', { updateOn: 'blur' });
// example with validators
const c= new FormControl('', {
validators: Validators.required,
updateOn: 'blur'
});
Github : feat(forms): add updateOn blur option to FormControls
si può usare direttamente (sfocatura) evento nel tag input .
<div>
<input [value] = "" (blur) = "result = $event.target.value" placeholder="Type Something">
{{result}}
</div>
e otterrete output in "risultato"
(sfocatura) evento non funziona in IE11. Qualche lavoro in giro? –
Appena testato su IE11 (11.0.9600) e ha funzionato alla perfezione! – Timigen
E riguardo le forme reattive? Come farlo in forme reattive. – ATHER