web-dev-qa-db-ja.com

Angular 5:プロパティ 'then'はタイプ 'Observable <any>'に存在しません

「[ts]プロパティ 'then'はタイプ 'Observable'に存在しません。」というエラーメッセージが表示されました。解決方法は?

これは私のコンポーネントです:

  getUsers(){
    this.authService.getUsers().then((res) => {
      this.user = res;
      console.log(this.user);
    },(err) => {
      console.log(err);
    });
  }

これは私のサービスです:

 getUsers(){
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    return this.http.get('http://192.168.100.6:3000/users/data-tracer', {headers: headers})
    .map(res => res.json());
  }
4
Fatih

thenオブジェクトでPromiseを呼び出すことができるため、サービスはObaservableオブジェクトを返すため、toPromise()メソッドおよびcatchメソッドを使用して、次の方法でエラーを管理します。

getUsers(){
    this.authService.getUsers()
    .toPromise()
    .then((res) => {
      this.user = res;
      console.log(this.user);
    })
    .catch(err=> { console.log(err) });
  }

ここでは、 [〜#〜]デモ[〜#〜] を見ることができます。それで全部です。

12
Marco Barbero

「then」はpromiseの概念ですが、RxJSは少し異なります。複数の呼び出しをシーケンスする場合は、forkJoinを使用する必要があります。成功ハンドラーが必要な場合は、subscribeとcatchを使用します。

getUsers(){
    this.authService.getUsers().subscribe((res) => {
      this.user = res;
      console.log(this.user);
    }).catch((err) => {
      console.log(err);
    });
  }

Promiseとobservable( Angular-Promise vs Observable )の違いを理解し、適切な設計上の決定を行うようにしてください。

4
NitinSingh

このようなものを試してください。

import 'rxjs/add/operator/toPromise';
import 'rxjs/add/operator/map';

...

this.yourService.getWhatYouWant()
.map(data => {
  // do some thing
})
.toPromise()
.catch(err => {
  // handle error
});
0