right way to add days into a array

Question

Im trying to make a table with a list of payments dates from a credit note, the problem is all my rows are getting the same date.

im using moment and the problem is when i save the value like a data format string all goes good, but I need the objet to save it like a date with carbon on the background.

This is the actual code

crearTablaPagos(): void{

         let pagoIndividual = this.comprasVentasForm.totalConIntereses/this.numeroCuotas;
         //console.log(fecha);
         let contador = 1; 
         let nextFecha = moment(this.comprasVentasForm.incio);
         this.comprasVentasForm.tablaPagos = [];

         while(contador <= this.numeroCuotas) {
            let pago: any;
            pago = {};

            pago.numeroCuota = contador;
            pago.valorCuota = (pagoIndividual).toFixed(2);  
            pago.fechaPago = nextFecha.add(this.plazo, 'days').format('YYYY-MMM-DD');
            pago.comprasVentas  = this.comprasVentasForm.id;
            pago.saldo  = (pagoIndividual).toFixed(2);
            this.comprasVentasForm.tablaPagos.push(pago);


            contador++;
         }


    }

and this is how im showing it

 <tr *ngFor="let pago of comprasVentasForm.tablaPagos">
                                    <th>{{pago.numeroCuota}}</th>
                                    <th>{{pago.fechaPago}}</th>
                                    <th>{{pago.valorCuota}}</th>
                                </tr>

but this not what I need

I need the moment objet so I do this

 crearTablaPagos(): void{

         let pagoIndividual = this.comprasVentasForm.totalConIntereses/this.numeroCuotas;
         //console.log(fecha);
         let contador = 1; 
         let nextFecha = moment(this.comprasVentasForm.incio);
         this.comprasVentasForm.tablaPagos = [];

         while(contador <= this.numeroCuotas) {
            let pago: any;
            pago = {};

            pago.numeroCuota = contador;
            pago.valorCuota = (pagoIndividual).toFixed(2);  
            pago.fechaPago = nextFecha;
            pago.comprasVentas  = this.comprasVentasForm.id;
            pago.saldo  = (pagoIndividual).toFixed(2);
            this.comprasVentasForm.tablaPagos.push(pago);

            nextFecha =  nextFecha.add(this.plazo, 'days');
            contador++;
         }


    }

and to show it

                                <tr *ngFor="let pago of comprasVentasForm.tablaPagos">
                                    <th>{{pago.numeroCuota}}</th>
                                    <th>{{pago.fechaPago.format('YYYY-MMM-DD')}}</th>
                                    <th>{{pago.valorCuota}}</th>
                                </tr>

but now im getting this

this is making me crazy I don't understand why this is happen

I wanna know what is the best way to add days to my array

Answer 1

You are adding days to the same date reference and all your array items also point to the same date reference.

Try doing a clone before adding days, like so

nextFecha = nextFecha.clone();
nextFecha.add(this.plazo, 'days');