Angular 5: 类型 'Observable<any>' 上不存在属性 'then'。

Question

我得到了这个错误信息：“[ts] Property 'then' does not exist on type '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());
  }

- Fatih

Answer 1

您可以在Promise对象上调用then方法，所以因为您的服务返回一个Obaservable对象，您需要使用toPromise()方法将其转换为Promise对象，并使用catch方法以此方式管理错误:

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

在这里你可以看到一个演示。

就是这样。

- Marco Barbero

---

为什么我在 .catch(err=> { console.log(err) }); 中收到了 "[ts] Argument expression expected." 的错误提示？ - Fatih

@Fatih，抱歉，我在.catch之前忘记了一个括号。 - Marco Barbero

如果需要，我可以在Stackblitz上放一个DEMO。 - Marco Barbero

Answer 2

"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），并做出适当的设计决策。

- NitinSingh

Answer 3

我通过使用toPromise()函数解决了这个问题，代码如下：

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

- gandharv mahajan

Answer 4

尝试类似这样的东西。

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

...

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

- Anuradha Gunasekara

Answer 5

使用toPromise().then()，首先需要获取Observable对象
我使用了以下解决方案：

   import { of } from "rxjs";
----------------

 var clienteDocument = this.clienteCollection.doc(nuevocliente.cli_cedula);
    var clienteObservable = clienteDocument.valueChanges(); //Get Observable<Object> from Firebase
    var cliente = of(clienteObservable); //Obtengo el Objeto de Observable
    cliente.toPromise().then((cliente) => {  
      if (cliente == null) {
        //cliente not existe

      } else {
        //cliente exist :)

      }
    });

- Shoniisra