Я не понимаю, почему это не работает, я новичок в переполнении стека и машинописи, прошу прощения, если не правильно задам вопрос, спасибо!
cartService.ts
cartProducts: Product[] = [];
subTotalPrice : Subject<number> = new Subject<number>();
totalQuantityy :Subject<number> = new Subject<number>();
subTotalPriceMyCart(){
let subTotalPriceValue :number = 0;
let totalQuantityValue :number = 0;
for(let currentCartItem of this.cartProducts){
subTotalPriceValue += currentCartItem.quantity * currentCartItem.price;
totalQuantityValue += currentCartItem.quantity;
}
this.subTotalPrice.next(subTotalPriceValue);
this.totalQuantityy.next(totalQuantityValue);
}
cart.component.ts
subTotal(){
this.cartService.subTotalPriceMyCart();
}
cart.component.html
<h2>Order Summary</h2><hr>
<h5 >{{subTotal()}}</h5>
🤔 А знаете ли вы, что...
Angular позволяет создавать кастомные директивы для расширения функциональности HTML.
subTotal
— это функция, которая вызывается из вашего шаблона. Функция subTotal
в card.component.ts
снова вызывает subTotalPriceMyCart
в cartService.ts
. Но по вашему коду ничего не возвращается.
Всю логику можно улучшить. Вместо привязки к функции в вашем шаблоне вы, вероятно, захотите привязаться к фактическому значению. Для этого вам нужна переменная в вашем card.component.ts
, которая хранит это значение. Вы можете подписаться на субъекты в своей службе, чтобы получать уведомления об изменениях и соответствующим образом обновлять сохраненное значение, или реализовать некоторую функцию получения для первоначального извлечения значения (возможно, BehaviorSubject лучше подходит для получения текущего значения при подписке и для получения уведомления об изменениях).
Если эти значения нужны только в этом компоненте, вы также можете подумать о решении без службы.