Angular .subscribe 给出编译错误答案

【问题标题】：Angular .subscribe giving compilation errorsAngular .subscribe 给出编译错误
【发布时间】：2018-01-18 20:01:48
【问题描述】：

我正在尝试在我的组件模板中显示 http get 调用响应数据。

我正在尝试从从我的服务返回到我的组件的 Observable 中提取对象数据。我使用了 .subscribe 方法，我得到“Type 'Subscription' is notassignable to type DataModel.Property 'entitlement' missing in type Subscription”。

不知道我哪里出错了。请指教-

我的模型文件：-

   export class DataModel {
        public entitlement: string;
        public serviceId: string;
        public techType: string;
        public avcId: string;
        public accessTechnology: string;
        public subAccessType: string;
    }

我的组件文件：-

import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { DataModel } from '../data-model';
import { DataFetchService } from '../data-fetch.service';
import { DataRequest } from '../data-request';


    @Component({
      selector: 'app-dashboard',
      templateUrl: './dashboard.component.html',
      styleUrls: ['./dashboard.component.css']
    })
    export class DashboardComponent{
        serviceType: string;
        serviceNumber: string;         
        cidn: string;
        spid: string;
        public data: DataModel;

      constructor(private datafetchService: DataFetchService) {
          }

       datapull(): void{
          this.data = this.datafetchService.getData(this.serviceType,this.serviceNumber,this.cidn,this.spid).subscribe(data => {this.data = data});
      }

    }

我的服务文件：-

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { DataModel } from './data-model';
import { UUID } from 'angular2-uuid';



@Injectable()

export class DataFetchService {

    private url: string = "xxx";
    private auth: string = "yyyy";
    private xrid: string;

  constructor(private http: HttpClient) { 
   }

   ngOnInit() {
    this.xrid = UUID.UUID();
  }

  getData(serviceType: string,serviceNumber: string,cidn: string,spid:string): Observable<DataModel> {

      const params = new HttpParams()
    .set('serviceType', serviceType)
    .set('serviceNumber', serviceNumber);
      const headers = new HttpHeaders()
            .set("CIDN", cidn).set("SPID", spid).set("x-request-id", this.xrid).set("Authorization",this.auth);

    return this.http.get<DataModel>(this.url,{headers,params});
  }

}

【问题讨论】：

订阅有返回类型，与示例组件中数据成员的类型不匹配

标签： angular observable

【解决方案1】：

当您调用subscribe() 时，您会返回一个Subscription 对象。当您这样做时，您将该订阅分配给您的 this.data 属性：

this.data = this.datafetchService.getData(this.serviceType,this.serviceNumber,this.cidn,this.spid).subscribe(data => {this.data = data});

只需删除分配，它应该会按照您的预期工作：

this.datafetchService.getData(this.serviceType,this.serviceNumber,this.cidn,this.spid).subscribe(data => {this.data = data});

Typescript 试图将 Subscription 解释为 DataModel 对象，这就是为什么它告诉您“类型‘订阅’不可分配给类型 DataModel。订阅类型中缺少属性‘权利’””

【讨论】：