Id 的 Angular Firebase 数据库值显示未定义答案

【问题标题】：Angular Firebase database value of Id is showing undefinedId 的 Angular Firebase 数据库值显示未定义
【发布时间】：2020-08-08 02:21:31
【问题描述】：

在 Firebase 数据库中，购物车 ID 显示未定义（检查图片），并且仅在 Firebase 数据库中添加了一个类别项目，当添加另一个产品时未显示在数据库中，但数量增加了。

这是购物车服务。

请帮帮我。

import { Injectable } from '@angular/core';
import { AngularFireDatabase } from 'angularfire2/database';
import { Product } from './models/product';
//import 'rxjs/add/operator/take';
import { take } from 'rxjs/operators';
import 'rxjs/add/operator/take';

@Injectable({
  providedIn: 'root'
})
export class ShoppingCardService {


  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<any>('/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$.snapshotChanges().pipe(take(1)).subscribe((item: any) => {
      if (item.key != null) {
        item$.update({ quantity: (item.payload.val().quantity || 0) + 1 });
      }
      else {
        item$.set({ product: product, quantity: 1 });
      }
    });
  }
}

这是 product-card-component.ts ... 在 product-card-component.ts 中使用了 addToCart() 方法。

import { Component, OnInit, Input } from '@angular/core';
import { Product } from '../models/product';
import { ShoppingCardService } from '../shopping-card.service';

@Component({
  selector: 'app-product-card',
  templateUrl: './product-card.component.html',
  styleUrls: ['./product-card.component.css']
})
export class ProductCardComponent  {
  @Input('product') product: Product;
  @Input('show-actions') showActions = true;
  constructor(private cartService: ShoppingCardService) { }



  addToCart(product: Product) {
    this.cartService.addToCart(product);


  }

}

model/product.ts

export interface Product {
  $key: string;
  title: string;
  price: number;
  category: string;
  imageUrl: string;
}

【问题讨论】：

A productId 在某处有一个未定义的值。我们看不到它在哪里，因为我们在任何地方都看不到对addToCart 的调用。您将不得不进行一些调试才能弄清楚这一点。
addToCart(product: Product) { this.cartService.addToCart(product);这是product-card-component.ts..
是的，您究竟传递给addToCart的是什么？
导出接口 Product { $key: string;标题：字符串；价格：数量；类别：字符串；图片网址：字符串； }
这看起来像一个数据结构，而不是一个确切的值。

标签： javascript angular firebase firebase-realtime-database angularfire2

【解决方案1】：

我有类似的问题
所以在model/product.ts里面，我把$key修改成了key

出口接口产品{ 键：字符串；标题：字符串；价格：数量；类别：字符串；图片网址：字符串； }

并在getItem方法调用路径的末尾添加了一个'/'

私人getItem（cartId：字符串，productId：字符串）{ return this.db.object('/shopping-carts/' + cartId + '/items/' + productId +'/'); }

和我一起工作！

【讨论】：