'in my product page.ts i call getcart() mathod in ngOnInIt from cartservice to print my items in console

**in my product page.ts i call getcart() mathod in ngOnInIt from cartservice to print my items in console but in console i get this error Cannot read properties of undefined (reading '-Mx97cGeRG4RNfKhdNTZ')

can anyone help with this please?**

this is my cartservice

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

      constructor(private db:AngularFireDatabase) { }
    
      private create(){
        return this.db.list('/shoppingcart').push({
          datecreated:new Date().getTime()
        })
      }
      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 getcart(){
         let cartid= await this.getorcreatecartid();
         return this.db.object('/shoppingcart/'+cartid)
    
    
      }
      private getitem(cartid:any,productid:any){
        return this.db.object('/shoppingcart/'+cartid+'/items/'+productid);
    
      }
    
      async addtocart(product:any){
        let cartid=await this.getorcreatecartid();
        let item$=this.getitem(cartid,product.key)
        item$.snapshotChanges().pipe(take(1)).subscribe((item:any)=>{
          if(item.payload.exists()){
            item$.update({quantity: item.payload.val().quantity+1})
            
          }
          else{
            item$.update({
              product:{
                title:product.payload.val().title,
              price:product.payload.val().price,
              category:product.payload.val().category,
              imageUrl:product.payload.val().imageUrl
    
              },quantity:1
              
    
    
    
    
    
            })
          }
        })
    
    
      }
    
    
    }

productcomponent

@Component({
  selector: 'app-products',
  templateUrl: './products.component.html',
  styleUrls: ['./products.component.css']
})
export class ProductsComponent implements OnInit, OnDestroy {
  products: any[] = []
  filteredProducts: any[] = []
  cart: any

  category: any
  subscribe: Subscription

  constructor(private prodser: ProductserviceService, private catser: CategoryserviceService,
    private acroute: ActivatedRoute, private cartser: CartService) {
    this.subscribe = prodser.get().subscribe(products => {
      this.products = products
      this.acroute.queryParamMap.subscribe(params => {
        this.category = params.get('category')
        this.filteredProducts = (this.category) ? this.products.filter(p =>

          p.payload.val().category === this.category
        ) : this.products

      })

    })


  }




  async ngOnInit(): Promise<void> {
    (await this.cartser.getcart()).valueChanges().subscribe(cart => {
      this.cart = cart
      console.log(cart)

    }




    )







  }
  ngOnDestroy(): void {
    this.subscribe.unsubscribe()
  }




}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source