Truy cập 'this' Inside Promise

Question

Trong chức năng đánh số dưới đây, 'this' không giải quyết được ví dụ của EmailValidator. Làm thế nào tôi có thể sửa chức năng này để nó giải quyết đúng thể hiện của EmailVaildator và đến lượt nó, để tôi có thể truy cập _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

Bạn đang mất this, bởi vì bạn đang đi qua xung quanh isAvailableEmail như một chức năng "thô" ở đây:

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

Bạn có thể khắc phục điều này bằng cách gắn nó vào this (bằng cách sử dụng mũi tên chất béo):

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

Answer 2

Hóa ra là tài liệu tham khảo 'này' đã không xác định ngay cả khi nó đã được sử dụng như sau:

class EmailValidator { 

    constructor(private _registerServices: RegisterServices) { } 

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

tôi thu thập này có gì để làm với cách phương pháp này được gọi là, có lẽ đi qua một phương pháp không tĩnh nơi phương thức tĩnh được mong đợi:

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

Nếu ai đó có thể cung cấp một số hướng dẫn về những gì đang xảy ra ở đây, điều đó thật tuyệt vời.

My Giải pháp

Tôi sắp xếp lại mã của tôi và sản xuất như sau:

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; 
    } 
} 

Và sửa đổi sử dụng của nó:

... 
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] 
    }); 
... 

Những hoạt động chính xác.

Answer 3

Bạn gặp sự cố vì bạn đang chuyển giá trị isAvailable là một hàm. Bạn không thực hiện nó, bạn chỉ cần chuyển tham chiếu đến hàm.

Một cách để giải quyết nó là như trong @Thilo's answer

Một cách khác là gán isAvailable để một biểu thức lambda thay vì một hàm. như thế này:

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

tôi sẽ cung cấp để viết nó một chút khác nhau

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 })) 

     }); 

    } 
}