Wie man automatisch gefüllten Benutzernamen/Passwort aus einem Formular mit Ember

Question

lesen Jetzt habe ich ein Formular, das zwei Eingaben hat: Benutzername und Passwort. Wenn ich sie manuell eingegeben habe, kann meine Validierungsfunktion die Werte übernehmen. Wenn die Werte jedoch von der AutoFill-Funktion von Broswer ausgefüllt werden. Ember kann den Wert nicht erhalten, weil kein Ereignis ausgelöst wird. So habe ich diesen Code (von https://stackoverflow.com/questions/22324473/browser-autofill-databinding):

import Ember from 'ember'; 
export default Ember.TextField.reopen({ 
    triggerEvents: function() { 
    Ember.run.next(this, function() { 
     this.$().trigger("change"); 
    }); 
    }.on("didInsertElement") 
}); 

Und ich importiert sie in app.js

Irgendwie ist es immer noch nicht funktioniert. Wird didInsertElement durch AutoFill ausgelöst? Ich bin nicht sicher.

Ich verwende this.get('xxx'), um die Werte zu erhalten.

Wenn Sie eine bessere Möglichkeit haben, die Autofill-Erkennung von Glitzer erkennen zu lassen. Ich bin dafür offen.

Answer 1

Fügen Sie einfach Beobachter für Formularfelder hinzu. Beispiel:

// app/components/test-form.js 
import Component from '@ember/component'; 
    export default Component.extend({ 
     isChanged: Ember.observer('login', 'password', function() { 
     this.validate(); 
     }), 
     validate() { 
     let login = this.get('login'); 
     let password = this.get('password'); 
     console.log('validate', login, password); 
     }, 
     actions: { 
     submit() { 
      console.log('submit'); 
     } 
     } 
    }); 


// app/templates/components/test-form.hbs 
<form> 
    <label>Login 
    {{input type="text" value=login change='validate' }} 
    </label> 
    <label>Password 
    {{input type="password" value=password change='validate' }} 
    </label> 
    <button {{action 'submit'}}>Click</button> 
</form> 

PS. Getestet nur in Firefox.