我正在开发一个Angular5项目,并且我在两个不同的模板中使用了函数getQuantity。
在下面的模板"产品卡"中,getQuantity导致错误。
ProductCardComponent.html:8 ERROR TypeError: _co.shoppingCart.getQuantity is not a function
在其他模板"产品数量"中,它工作正常。
<div *ngIf="showActions && shoppingCart" class="card-footer">
<button *ngIf="shoppingCart.getQuantity(product) === 0; else updateQuantity"
(click)="addToCart()" class="btn btn-secondary btn-block">Add to Cart</button>
<ng-template #updateQuantity>
<app-product-quantity [product]="product"
[shopping-cart]="shoppingCart"></app-product-quantity>
</ng-template>
</div>
以下是我的ProductCardComponent组件:
import { ShoppingCart } from './../models/shopping-cart';
import { Product } from './../models/product';
import { Component, OnInit, Input } from '@angular/core';
import { ShoppingCartService } from '../shopping-cart.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;
@Input('shopping-cart') shoppingCart: ShoppingCart;
constructor(private cartService: ShoppingCartService) { }
addToCart() {
this.cartService.addToCart(this.product);
}
}
这是我的助手类,其中存在getQuantity方法:
import { ShoppingCartItem } from './shopping-cart-item';
import { Product } from './product';
export class ShoppingCart {
items: ShoppingCartItem[] = [];
constructor(public itemsMap: { [productId: string]: ShoppingCartItem }) {
for (const productId in itemsMap) {
if (productId) {
const item = itemsMap[productId];
if (item) {
this.items.push(new ShoppingCartItem(item.product, item.quantity));
}
}
}
}
getQuantity(product: Product) {
const item = this.itemsMap[product.key];
return item ? item.quantity : 0;
}
// other methods here
}
我无法找到我收到此错误的原因。我需要你的指导。提前谢谢。