Свойства 'update' и 'amount' не существуют для типа '{}' - PullRequest
0 голосов
/ 03 мая 2019

Я смотрю учебник Моша Хамедани с использованием Angular версии 6, но проблема в версии учебника 4. Я работаю над проектом электронной коммерции на кнопке AddToCart, где продукт должен увеличить свое количество, нажав кнопку кнопка и обновляется в Firebase с использованием productId, а также, если я пытаюсь добавить новый продукт, то идентификатор этого нового продукта должен быть добавлен в базу данных AngularFire. У меня ошибка в последней строке item.update () и item.quantity. Пожалуйста, пройдите код и предложите мне лучшее решение. Заранее спасибо

Вот код.

торговые-cart.service.ts

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

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

  constructor(private db: AngularFireDatabase, ) { }

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

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

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

 private async getOrCreateCart() {
    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.getOrCreateCart();
    let item$ = this.getItem(cartId, product.key);

    item$.valueChanges().pipe(take(1)).subscribe(item => {
      // I'am getting error in update() and quantity
      item.update({ product: product,quantity: (item.quantity || 0) + 1});
    })
  }
}

Ожидаемые результаты состоят в том, что после нажатия кнопки «Добавить в корзину» количество продукта должно быть обновлено в базе данных

Посмотрите мои другие файлы (для справки) 1. home.component.html (при нажатии этой кнопки происходит переход к файлу .ts, как показано ниже)

<div class="card-footer">
    <button (click)="addToCart(product)" style="background: #2980b9; 
             color:white" class="btn btn-block">Add to Cart
    </button>
</div>
  1. home.component.ts (здесь определено событие клика)
addToCart(product:Product) {
     this.cartService.addToCart(product);
   }

и последний файл 3. shopping-cart.service.ts

private async getOrCreateCart() {
    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.getOrCreateCart();
    let item$ = this.getItem(cartId, product.key);

    item$.valueChanges().pipe(take(1)).subscribe(item => {
      item$.update({ product: product,quantity: (item.quantity || 0) + 1});
    })
  } 

Вот изображения ошибок: 1. Ошибка вернулась Property quantity does not exist on type {} 2. Теперь, когда я изменяю вышеуказанный код addToCart (product: Product), который выглядит так:

async addToCart(product: Product) {
    let cartId = await this.getOrCreateCart();
    let item$ = this.getItem(cartId, product.key);

    item$.snapshotChanges().pipe(take(1)).subscribe((item: any) => {
      if(item.key != null) {
        item$.update({ product: product,quantity: (item.quantity || 0) + 1});
      } else {
        item$.set( {product:product, quantity:1});
     }   
    });
  }

Я получаю следующую ошибку: The project compiles successfully, but key is undefined after clicking the button

Это все, что у меня есть ... Пожалуйста, посмотрите ошибки еще раз и предложите лучшее решение ... Заранее спасибо

1 Ответ

0 голосов
/ 03 мая 2019

Вы используете метод обновления для значения, которое вы получаете из базы данных. Вы должны использовать метод обновления для объекта базы данных.

https://github.com/angular/angularfire2/blob/master/docs/rtdb/objects.md

Я не смог проверить это, дайте мне знать, если это работает.

async addToCart(product: Product) {
    let cartId = await this.getOrCreateCart();
    let itemRef = this.getItem(cartId, product.key);

    itemRef.valueChanges().pipe(take(1)).subscribe(item => {
      itemRef.update({ product: product,quantity: (item.quantity || 0) + 1});
    })
 }
...