输入'Observable&lt; {} []&gt;'不能分配给'Observable <requestoffer []>'

时间:2017-09-08 17:15:25

标签: angular typescript rxjs

我正在关注一个角火指南,由于一些奇怪的原因,我收到了这个错误:

Type 'Observable<{}[]>' is not assignable to type 'Observable<RequestOffer[]>'.
  Type '{}[]' is not assignable to type 'RequestOffer[]'.
    Type '{}' is not assignable to type 'RequestOffer'.
      Property 'request' is missing in type '{}'.

这是我的approve.component.ts,问题是:

import { OfferService } from './../offer.service';
import { Offer, Request, RequestOffer } from './../offer.model';
import { Observable } from 'rxjs/Rx';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-approve',
  templateUrl: './approve.component.html',
  styleUrls: ['./approve.component.css']
})
export class ApproveComponent implements OnInit {

  requests$: Observable<RequestOffer[]>;
  constructor(private offerService: OfferService) {
     this.requests$ = offerService.getOffersByStatus('new');
 }
 ngOnInit() {
 }

}

offer.model.ts:

export class Offer {
    public name: string;
    public cost: number;
    public date: Date;
    public $key: string;
    public comments: string;
    public currency: string;
        constructor(name: string, cost: number, date: Date, currency: string, comments: string) {
        this.name = name;
        this.cost = cost;
        this.date = date;
        this.currency = currency;
        this.comments = comments;
    }
}

export class Request {
    public $key: string;
    constructor(public email: string, public offerId: string, public status: string) { }
}
  export class RequestOffer {
     constructor(public request: Request, public offer: Offer) { }
}

还有一件事困扰着我。一切都在本地工作正常,除非我将它作为生产服务,我在chrome的控制台中得到这个错误:

 Error: Uncaught (in promise): TypeError: this.db.list(...).map(...).flatMap is not a function
TypeError: this.db.list(...).map(...).flatMap is not a function
    at l.getOffersByStatus (offer.service.ts:50)
    at new l (approve.component.ts:15)

offer.service.ts:

import { Observable } from 'rxjs/Observable';
import { Injectable } from '@angular/core';
import { AngularFireDatabase, FirebaseListObservable, 
    FirebaseObjectObservable } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';
import { Offer, Request, RequestOffer } from './offer.model';
@Injectable()
export class OfferService {
offer: Offer ;
offers: FirebaseListObservable<any[]>;
requests: FirebaseListObservable<any[]>;
constructor(private db: AngularFireDatabase) {
this.offers = this.db.list('/offers');
this.requests = this.db.list('/requests');
}
getAllOffers() {
return this.offers.map(
(data) => data.map(x => x as Offer)
);
}
deleteOfferByKey($key: string) {
this.offers.remove($key);
}
addOffer(offer: Offer) {
this.offers.push(offer);
}
editOffer(key: string, offer: Offer) {
this.db.object('offers/' + key).update(offer);
}

requestOffer(request: Request) {
    this.requests.push(request);
}

getOffersByStatus(status: string) {
    const queryList$ = this.db.list('/requests', {
        query: {
            orderByChild: 'status',
            equalTo: status
        }
    });
    return queryList$.map(
        requestList => requestList.map(request => this.db.object('offers/' + request.offerId)
            .map((offer) => {
                return new RequestOffer(request as Request, offer as Offer)
            }
            )))
        .flatMap(fobjs => Observable.combineLatest(fobjs));
}
approveOffer(req: RequestOffer) {
    this.db.object('requests/' + req.request.$key + 
'/status').set('approved').then;
    this.db.object('offers/' + req.offer.$key + '/totalOffers');
    alert('Offer Approved!');
}
declineOffer($key: string) {
    this.requests.remove($key);
    alert('Offer Declined!');
}
}

2 个答案:

答案 0 :(得分:0)

getOffersByStatus上强制执行返回类型:

getOffersByStatus(status: string): Observable<RequestOffer[]> {

TypeScript可能会为您提供一个新错误(本地化为该方法)以指导您。

答案 1 :(得分:0)

我认为方法getOffersByStatus(status:string)没有返回正确的类型。尝试显式键入返回类型,如下所示: getOffersByStatus(status:string):可观察 我猜你需要删除flatmap。