为什么订阅无法读取 api 响应答案

【问题标题】：Why is subscribe failing to read api response为什么订阅无法读取 api 响应
【发布时间】：2021-06-02 00:20:06
【问题描述】：

我正在尝试使用一种方法，该方法使用其 ID 号为我提供用户信息

组件.ts

identificacion:any = this.route.snapshot.paramMap.get('identificacion');
  
  constructor(private route: ActivatedRoute, private dataService: DataService) { 
  }

  async ngOnInit() {
    await this.dataService.getParticipeByIdentificacion(this.identificacion).subscribe(resonse => console.log(resonse))
    }

服务调用：

getParticipeByIdentificacion(id) {
    this.tokenvalido();
    const token = this.getToken();
    return this.http.get(`${this.apiUrl}/participe/identificacion/${id}`);
  }

来自 api 的响应：

{
  "result": {
    "actividadEconomica": null,
    "genero": "Masculino",
    "estadoCivil": "SOLTERO",
    "contratos": [],
    "contactos": [],
    "direcciones": [],
    "referenciasPersonales": [],
    "referenciasBancarias": [],
    "idParticipe": 195,
    "idTipoIdentificacion": 1,
    "tipoIdentificacion": null,
    "identificacion": null,
    "nombres": "WILMER JAVIER",
    "apellidos": "DECIMAVILLA ESPINOZA",
    "razonSocial": "WILMER JAVIER DECIMAVILLA ESPINOZA",
    "fechaRegistro": "2021-02-08T19:57:30.277",
    "fechaModificacion": "2021-05-12T11:39:31.413",
    "usuarioRegistro": "SYSTEM",
    "usuarioModificacion": "",
    "estado": "Aprobado",
    "fechaNacimiento": "",
    "lugarNacimiento": "N/A",
    "idNacionalidad": 1,
    "fechaExpedicionCedula": "0001-01-01T00:00:00",
    "correo1": null,
    "correo2": null,
    "telefono1": null,
    "telefono2": null,
    "celular": null,
    "idGenero": 1,
    "idEstadoCivil": 1,
    "idNivelEstudios": 3,
    "idNivelIngresos": 2,
    "idProfesion": 1,
    "idGrado": 102,
    "identificacionConyuge": null,
    "conyuge": null,
    "idTipoVivienda": 1,
    "tiempoResidencia": 1,
    "photoUrl": null,
    "codigoUniformado": null,
    "fechaIngreso": "2010-10-21T00:00:00",
    "aporteAdicional": 0,
    "observaciones": null
  },
  "error": null,
  "message": "El servidor respondio con el codigo de estado: 200 OK",
  "statusCode": "OK",
  "success": true
}

我得到的错误：

错误类型错误：您在预期流的位置提供了“未定义”。您可以提供 Observable、Promise、Array 或 Iterable。

希望你们能帮我解决这个问题:)

【问题讨论】：

我怀疑该错误与您发布的代码有关。此外，您不能等待可观察（或订阅）..

标签： angular

【解决方案1】：

您可以避免使用异步 ngOnInit 并仅使用带有 isLoad 标志的 observables。

  identificacion:any;
  isLoad: boolean;
  subscriptions = new Subscription
  constructor(private route: ActivatedRoute, private dataService: DataService) { 
  }

 ngOnInit() {
  this.identification = this.route.snapshot.paramMap.get('identificacion');

  const stream = this.dataService.getParticipeByIdentificacion(this.identificacion).pipe(
    tap((res) => console.log(res))
  .subscribe(() => this.isLoad = true)

  this.subscription.add(stream)
  }


 ngOnDestroy() {
  this.subscriptions.unsubscribe() //remember to unsuscribe 
 }

只有当你有数据时，你才能使用你的标志来呈现页面

<ng-container *ngIf="isLoad">
 //here your data are load
</ng-container>

rxjs 和 observable 非常强大。我避免了所有的异步等待，并且只在我的应用程序中使用它们，我从中获得了很多乐趣！

【讨论】：