Как использовать функцию обратного вызова при успешном запросе HTTP в Angular2

Я новичок в Angular2. Я упомянул учебник Hero, представленный на официальном веб-сайте, и написал следующий код для запроса HTTP-запроса в Angular2 согласно моему требованию. Я привык к java-скрипту, и я использую вызовы AJAX для взаимодействия с веб-сервером, в вызове javascript-AJAX мы можем выполнять некоторые функции при успешном вызове AJAX (функция обратного вызова). Как достичь этого в угловом2? Я также хочу использовать оповещения. При успешном завершении каждого вызова отображается окно предупреждения, в котором говорится о его успехе или неудаче.

@Injectable()
export class LicenceService {
constructor(private http: Http) {}
private headers = new Headers({'Content-Type': 'application/json'});
/* URL to web api*/
private licenceUrl = 'http://localhost:5000/***/****/installation/uploadLicense';  



sendData(key: string){
    return this.http
        .post(this.licenceUrl, key, this.headers)
        .toPromise()
        .then(res => res.json().data)
        .catch(this.handleError);
}
private static handleError (error: any) {
    console.log(error);
    return Promise.reject(error.json());
}

angular,angular2-services,

2

Ответов: 2


3 принят

Все, что вам нужно, уже находится в вашем коде

sendData(key: string){
    return this.http
        .post(this.licenceUrl, key, this.headers)
        .toPromise()
        .then(res => {
           res.json().data;
           // code here is executed on success
         })
        .catch(this.handleError);
}

или для вызывающего абонента

this.sendData(somekey).then(result => /*put after after success code here */);

1

Хотя, на ваш вопрос уже дан ответ. Вот еще один подход, который сохраняет логику Sevice и callback. Я достиг этого с использованием subscibe и Observable

Вот мой question.compnent.ts

    ngOnInit() {
               this.getQuestions();
    }        
    getQuestions() {
        this.yourService.getQuestions()
            .subscribe(
            data => this.displayData = data,
            error => this.errorMessage = <any>error,
            () => { 
                  //this gets called on completion, callback code comes here
                  } 
            );
    } 

И мой вопрос.service.ts, который занимается обработкой части HTTP-запросов

   getQuestions(): Observable<DisplayData[]>{
      const endPoint = 'http://localhost:3000/yourApi';
      return this.http.get(endPoint).map((response: Response) => response.json());
}

Примечание . This.displayData - это переменная типа DisplayData [], которая используется как наблюдаемая в службе.

Извините, за длинную статью. Приветствия :)

угловые, angular2-услуги,