Angular Http Post Observable не запускает подписку

#angular #typescript #observable

Вопрос:

Я не уверен, полностью ли я понимаю наблюдаемые в Angular, поскольку моя наблюдаемая не «запускается» и не получает никакой информации от subscribe при вызове. Я создаю простую систему входа в систему и пытаюсь получить сообщение от Http post о том, что оно прошло успешно, у меня есть следующая наблюдаемая функция в моем пользовательском сервисе

 addUser(user: User) : Observable<any> {
    var headers = new HttpHeaders()
    headers.append('Content-Type', 'application/json');

    return this.http.post('http://localhost:4000/api/users/add', user,{headers:headers}).pipe(
        map((response: any) => response.json())
    );
}
 

Затем у меня есть компонент register с функцией, onSubmit , которая вызывается при отправке формы. Эта функция вызывается addUser из службы для отправки нового пользователя в API и добавления его в базу данных.

 onSubmit(): void {
    this.userService.addUser(this.user)
        .subscribe(res => {
            console.log("Registration successful");
            this.isSuccessful = true;
        },
        err => {
            console.error("Registration failed: "   err);
            this.isSignUpFailed = true;
        }
    );
}
 

Вызов Http post работает, мой API / серверная часть получает данные и успешно добавляет пользователя в базу данных. Моя проблема в Angular, Observable никогда не выдает информацию или ответ о том, что он прошел успешно, то есть он никогда не выполняет следующее при вызове подписки в onSubmit функции

 console.log("Registration successful");
this.isSuccessful = true;
 

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

Комментарии:

1. Вам это не нужно: map((response: any) => response.json() — если у вас нет очень старой версии angular ..? Кроме того, вам не нужны заголовки.

Ответ №1:

просто удалите канал, и он будет работать нормально, нет необходимости в response.json

проверьте свою консоль, вы обнаружите что-то вроде этой ошибки

 Registration failed: TypeError: response.json is not a function
 
 addUser(user: User): Observable<any> {
    var headers = new HttpHeaders();
    headers.append("Content-Type", "application/json");
 
    return this.http
      .post("https://jsonplaceholder.typicode.com/posts", user, {
        headers: headers
      })
  }
 

Комментарии:

1. Удалил канал, но по-прежнему не получал никаких сообщений. Интересно, что если я обновляю после отправки, я получаю сообщение об ошибке от наблюдателя.

2. пожалуйста, проверьте эту ссылку и сравните с ней свою работу

3. Взглянул, я не увидел большой разницы в моем сообщении и примерах сообщений, показанных в предоставленной вами ссылке docs. Единственное, что я видел, что я не пробовал, это добавление параметров HTTP в аргументы post. Я попытался добавить observe: ‘body’ и ответ, но все равно ничего не получил.

Ответ №2:

Оказывается, это не имеет никакого отношения к Angular. Глупая ошибка, проблема заключалась в том, что мой API не отправлял никакой информации обратно после вызова post, он добавлял данные в базу данных, но не возвращал никаких сообщений, из-за чего наблюдаемый не реагировал. Просто я использовал Observable, который вызывал функцию, которая обрабатывала данные, HTTP-запрос, но ничего не возвращала. Я предполагал, что статус HTTP автоматически вернет что-то для наблюдаемого.