Angular2 возвращает данные из службы проверки после Http позвонить

Question

меня создать службу проверки для моей регистрационной формы и один из статических методов проверки, если введенный адрес электронной почты можно получить по телефону моего API следующим образом:

static emailAvailable(control){ 

    let injector = ReflectiveInjector.resolveAndCreate([HTTP_PROVIDERS]); 
    let http = injector.get(Http); 
    let valid = "E-mail is available"; 

    http.post('https://secretapi.com/email', JSON.stringify({ email: control.value })) 
    .map((res: Response) => res.json()) 
    .subscribe(function(result){ 
     if(result.success){ 
      valid = result.success; //The console.log on the line below is correct, the one at the bottom of the script never changes. 
      console.log(valid); 
      return null; //Doesn't do anything? 
     }else{ 
      valid = result.error; //The console.log on the line below is correct, the one at the bottom of the script never changes. 
      console.log(valid); 
      return { 'invalidEmailAddress': true }; //Doesn't do anything, just like the return above 
     } 
    }); 

    console.log(valid); //Output always "E-mail is available" 
} 

Он должен вернуть «null» в средство проверки формы, когда оно доступно. Последний console.log внизу должен вывести сообщение, которое оно получает при вызове подписки. Этого не происходит, и я не уверен, почему. По какой-то причине все, что происходит внутри вызова подписки, содержится там и никогда не достигает проверки. Что я должен изменить? Я понятия не имею, и уже несколько часов ищу в Интернете.

Answer 1

Вы должны вернуть Observable или Promise из вашего валидатора:

return http.post('https://secretapi.com/email', ... 

console.log(...) не имеет никакого смысла здесь, так как она будет выполнена после того, как Observable был создан как объект, но не после того, как ajax call be bee производства.

Если вы хотите вывести что-то после того, как ответ был получен, вы должны переместить его в subscribe

Answer 2

Таким образом, в конце концов, это website был правильный ответ. Также важно заметить, что валидатор Angular2 Form для размещения валидаторов Async в третьем (3) параметре и не вместе в массиве во втором (2) параметре. Это заняло у меня около 3 часов, чтобы понять.

функция checkEmail (контроль: контроль) {

let injector = ReflectiveInjector.resolveAndCreate([HTTP_PROVIDERS]); 
let http = injector.get(Http); 

return new Observable((obs: any) => { 
    control 
     .valueChanges 
     .debounceTime(400) 
     .flatMap(value => http.post('https://secretapi.com/email', JSON.stringify({ email: control.value }))) 
     .map((res: Response) => res.json()) 
     .subscribe(
      data => { 
       if(data.success){ 
        obs.next(null); 
        obs.complete(); 
       } else { 
        obs.next({ 'invalidEmailAddress': true }); 
        obs.complete(); 
       } 
      } 
     ); 
}); 

}

валидатор должен выглядеть примерно так, с первым валидаторы проверки на необходимости и если это на самом деле адрес электронной почты и последнее делание асинхронный вызов на сервер, чтобы узнать, еще ли он не используется:

this.registerForm = this.formBuilder.group({ 
     'email': ['', [Validators.required, ValidationService.emailValidator], ValidationService.emailAvailable], 
    });