类型"AngularFireObject< {}>"上不存在属性"pipe" [英] Property 'pipe' does not exist on type 'AngularFireObject<{}>'

问题描述

我是Angular的初学者.我正在使用Angular版本6观看Mosh Hamedani的教程，但问题是该教程的版本是4.我正在AddToCart按钮上的电子商务项目中，该产品应通过单击按钮来增加数量，并进行更新.在Firebase中使用productId，并且如果我尝试添加新产品，则该新产品的ID也应添加到AngularFire数据库中.

I'm a beginner to Angular. I'm watching the tutorial of Mosh Hamedani using the Angular version 6 but the problem is the tutorial version is 4. I'm working on the e-commerce project on AddToCart button where the product should increase it's quantity by clicking the button and updated in Firebase using productId and also if I try to add new product then id of that new product should add in AngularFire Database.

现在一切正常，在shopping-cart.service.ts文件中出现错误.错误出现在最后一行 async addToCart(product:Product)中，该错误表明在AngularFireObject类型上不存在属性管道.

Everything is working perfectly now I'm getting error in shopping-cart.service.ts file. The error is in the last line async addToCart(product: Product) where the error shows property pipe doesn't exist on type AngularFireObject.

这是代码.

shopping-cart.service.ts

import { Injectable } from '@angular/core';
import { AngularFireDatabase } from '@angular/fire/database';
import { Product } from '../models/products';
import { take } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})

export class ShoppingCartService {
   constructor(private db: AngularFireDatabase) { }

private create(){
    return this.db.list('/shopping-carts').push({
        dateCreated: new Date().getTime()
    })
}

private getCart(cartId: String){
    return this.db.object('/shopping-carts/' + cartId);
}

private getItem(cartId: string, productId: string){
    return this.db.object('/shopping-carts/' + cartId + '/items/' + productId);
}

private async getOrCreateCartId(){
    let cartId = localStorage.getItem('cartId');
     if(cartId) return cartId;

    let result = await this.create();
    localStorage.setItem('cartId', result.key);
    return result.key;
}

async addToCart(product: Product){
    let cartId = await this.getOrCreateCartId();
    let item$ = this.getItem(cartId, product.key);
    item$.pipe(take(1)).subscribe(item => {
        item$.update({ product: product, quantity:(item.quantity || 0) + 1 });
    });
}

}

推荐答案

这里的问题是您的this.getItem()方法没有返回Observable，而是返回了AngularFireObject，而没有返回pipe属性，因此您应该调用valuChanges方法，该方法将返回Observable

the problem here is that your this.getItem() method isn't returning an Observable, instead it returns AngularFireObject, which hasn't pipe property, so you should call valuChanges method which will return an Observable

private getItem(cartId: string, productId: string){
    return this.db.object('/shopping-carts/' + cartId + '/items/' + productId).valueChanges();
}

async addToCart(product: Product){
    let cartId = await this.getOrCreateCartId();
    let item$ = this.getItem(cartId, product.key);
    item$.pipe(take(1)).subscribe(item => {
        item$.update({ product: product, quantity:(item.quantity || 0) + 1 });
    });
}

这篇关于类型"AngularFireObject< {}>"上不存在属性"pipe"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！