Accesso 'this' Inside Promise

Question

Nella funzione dattiloscritto di seguito, 'this' non risolve l'istanza di EmailValidator. Come posso correggere questa funzione in modo che risolva l'istanza corretta di EmailVaildator ea sua volta, in modo che possa accedere a _registerServices?

class EmailValidator { 

    constructor(private _registerServices: RegisterServices) { } 

    isAvailable(c: AbstractControl): Promise<ValidationResult> { 
     let q = new Promise((resolve, reject) => { 
      this._registerServices.emailIsAvailable(antiForgeryToken(), c.value) 
       .then(result => { 
        // Need to actually check the result. 
        resolve({ "emailtaken": true }) 
       }, 
       error => { 
        // Need to communicate the server error? Probably not. 
        resolve({ "servererror": true }) 
       }); 
     }); 

     return q; 
    } 
} 

Answer 1

Stai perdendo this, perché si sta passando intorno al isAvailableEmail in funzione "raw" qui:

email: ['', Validators.required, this._emailValidator.isAvailableEmail] 

È possibile risolvere questo legandosi al this (usando la freccia grasso):

email: ['', Validators.required, 
    (control) => { this._emailValidator.isAvailableEmail(control) } 
] 

Answer 2

si è scoperto che il 'questo' riferimento è stato indefinito, anche se è stato utilizzato come segue:

class EmailValidator { 

    constructor(private _registerServices: RegisterServices) { } 

    isAvailable(c: AbstractControl): EmailValidator { 
     return this; // 'This' is undefined! 
    } 
} 

ho raccogliere questo ha qualcosa a che fare con il modo in cui il metodo è stato chiamato, forse passando un metodo non statico, dove era previsto un metodo statico:

... 
this.registerForm = fb.group({ 
    email: ['', Validators.required, this._emailValidator.isAvailableEmail], 
    password: ['', Validators.compose([Validators.required, Validators.minLength(8)])], 
    phoneNumber: ['', Validators.required], 
    country: ['', Validators.required] 
    }); 
... 

Se qualcuno potrebbe offrire alcune indicazioni su ciò che sta accadendo qui, sarebbe fantastico.

mia soluzione

ho riordinato il mio codice e prodotto il seguente:

class EmailValidator { 

    static isAvailableEmail(services: RegisterServices): (AbstractControl) => Promise<ValidationResult> { 
     let g = (c: AbstractControl) => { 
      return new Promise((resolve, reject) => { 
       services.emailIsAvailable(antiForgeryToken(), c.value) 
        .then(result => { 
         // Need to actually check the result. 
         resolve({ "emailtaken": true }) 
        }, 
        error => { 
         // Need to communicate the server error? Probably not. 
         resolve({ "servererror": true }) 
        }); 
      }); 
     }; 

     return g; 
    } 
} 

e modificato il suo utilizzo:

... 
this.registerForm = fb.group({ 
    email: ['', Validators.required, 
     EmailValidator.isAvailableEmail(this._registerService)], 
    password: ['', Validators.compose([Validators.required, Validators.minLength(8)])], 
    phoneNumber: ['', Validators.required], 
    country: ['', Validators.required] 
    }); 
... 

che funziona correttamente.

Answer 3

Si ha il problema perché si sta passando il valore di isAvailable che è una funzione. Non lo stai eseguendo, stai solo passando il riferimento alla funzione.

Un modo per risolvere è come in @Thilo's answer

Un altro modo è quello di assegnare isAvailable a un'espressione lambda invece di una funzione. in questo modo:

class EmailValidator { 

    constructor(private _registerServices: RegisterServices) { } 

    isAvailable = (c: AbstractControl): Promise<ValidationResult> => { 
     let q = new Promise((resolve, reject) => { 
      this._registerServices.emailIsAvailable(antiForgeryToken(), c.value) 
       .then(result => { 
        // Need to actually check the result. 
        resolve({ "emailtaken": true }) 
       }, 
       error => { 
        // Need to communicate the server error? Probably not. 
        resolve({ "servererror": true }) 
       }); 
     }); 

     return q; 
    } 
} 

Answer 4

vorrei offrire a scrivere un po 'diverso

class EmailValidator { 

    constructor(private _registerServices: RegisterServices) { } 

    isAvailable(c: AbstractControl): Promise<ValidationResult> { 
     return this._registerServices.emailIsAvailable(antiForgeryToken(), c.value) 
      .then(result => { 
       // Need to actually check the result. 
       return { "emailtaken": true } 
      }) 
// shorter .then(result => ({ "emailtaken": true })) 
      .catch(error => { 
       // Need to communicate the server error? Probably not. 
       return { "servererror": true } 
      }); 
// shorter .catch(error => ({ "servererror": true })) 

     }); 

    } 
}