hace poco que estoy tratando con Angular y me encuentro con un problema que no consigo resolver. Quiero que cada vez que haga click en el botón, se añadan elementos a un array. Cuando toco sobre el mismo elemento se almacena bien en el array, pero cuando toco sobre otro se borra y empieza a contar desde nuevo.Dejo aquí mi código:
EDIT: Hola, he probado lo que me recomendáis pero no funciona... He podido observar que me crea un array de productos, si voy metiendo del mismo producto el array va creciendo correctamente. Pero si meto otro producto, el array empieza de nuevo. ¿Qué pasa si vuelvo a meter el mismo producto que la primera vez? Para mi sorpresa lo que hace es que sigue metiendo productos en el primer array. La conclusión es que crea un array para cada grupo del mismo producto, en lugar de unificarse. El problema es que no encuentro la manera de acceder a esos arrays....
import { Component, OnInit, Input } from '@angular/core';
import { Product } from '../../models/product';
import { ProductService } from '../../services/product.service';
import { Observable } from 'rxjs/Rx';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'ng-gallery-product',
templateUrl: './gallery-product.component.html',
styleUrls: ['./gallery-product.component.css']
})
export class GalleryProductComponent implements OnInit {
@Input() product: Product;
public quantity: number = 0;
public productAdd: Object[] = [];
constructor(private productService: ProductService) { }
ngOnInit() {
}
quantityReset() {
this.quantity = 0;
return '';
}
addProductToCart(prod: string, id: string) {
this.productAdd.push(this.product);
console.log(this.productAdd);
//el console.log devuelve el array de objetos y acumula siempre que sea el mismo, pero cuando hago click sobre otro elemento, se borra el array y empieza de nuevo...
}
}
<div class="row">
<a href="#" id="btnver" class="ml-3 btn btn-primary" [routerLink]="['/product/', product.id]">Ver<i
class="ml-2 far fa-eye"></i></a>
<button id="btncarro" (click)="addProductToCart(product.id, quantity)" class="ml-3 btn btn-primary">Añadir al
carro<i class="ml-2 fas fa-cart-plus"></i></button>
</div>
public productAdd: = [];