Angular2 - Clone array of typed Object

Question

I have an array of typed object and I need to create a separated copy of it in order to be able to work on a clone.

I have to pass to configuratorProduct the copy of listProducts value:

  listProducts: Product[];
  configuratorProducts : Product[];

This is what I'm trying:

  this.configuratorProducts = this.listProducts.map(x => Object.assign({}, x));
    for(let p in this.configuratorProducts)
    {
      var ck = this.accessories.filter(x=> x.idProductParent == p.idProduct);
    }

The problem is that compiler returns:

Property 'idProduct' does not exist on type 'string'

How can i solve it ?

Thanks to support

what is the type of Product .?

Franklin Pious
– Franklin Pious

2018-04-18 12:24:40 +00:00
Commented Apr 18, 2018 at 12:24 — Franklin Pious
– Franklin Pious, Commented Apr 18, 2018 at 12:24
Its a simple class

DarioN1
– DarioN1

2018-04-18 12:24:58 +00:00
Commented Apr 18, 2018 at 12:24 — DarioN1
– DarioN1, Commented Apr 18, 2018 at 12:24

Adrian Brand · Accepted Answer · 2018-06-25 22:09:43Z

1

I like to use this clone function

const clone = obj =>
  Array.isArray(obj)
    ? obj.map(item => clone(item))
    : obj instanceof Date
      ? new Date(obj.getTime())
      : (typeof obj === 'object') && obj
        ? Object.getOwnPropertyNames(obj).reduce((o, prop) => ({ ...o, [prop]: clone(obj[prop]) }), {})
        : obj;

See a demo here

https://stackblitz.com/edit/typescript-qmzgf7

If it is an array it returns an array of each item cloned, if it is a date it creates a new date, if it is an object if reduces the properties onto a new object with each property cloned. If none of these it is a value object or a function and just return it.

edited Jun 25, 2018 at 22:09

answered Jun 25, 2018 at 3:03

Adrian Brand

21.8k4 gold badges46 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

bugs · Accepted Answer · 2018-04-18 12:40:49Z

1

You can make a copy using the spread operator

this.configuratorProducts = [...this.listProducts]

edited Apr 18, 2018 at 12:40

bugs

15.4k6 gold badges53 silver badges55 bronze badges

answered Apr 18, 2018 at 12:27

Franklin Pious

3,9083 gold badges29 silver badges31 bronze badges

Comments

amitdigga · Accepted Answer · 2018-04-18 13:12:23Z

1

Property 'idProduct' does not exist on type 'string' because there p is string, you made a simple mistake

for(let p in this.configuratorProducts)
{
  ...
}

should be

for(let p of this.configuratorProducts)
    {
      ...
    }

for(let p in this.configuratorProducts) is use to iterate keys of object, which are string. of is used to iterate values, which here are Product

And there are two type of cloning: Deep Clone and Shallow Clone, research well before using any.

edited Apr 18, 2018 at 13:12

answered Apr 18, 2018 at 13:01

amitdigga

7,3164 gold badges29 silver badges34 bronze badges

Comments

ForestG · Accepted Answer · 2018-04-18 12:26:53Z

0

Why don't you use general static clone tool?

For example:

import {Injectable} from "@angular/core";

@Injectable()
export class ObjectCloneUtility{

  public static clone(obj: Object): Object {
    if (null == obj || "object" != typeof obj) return obj;
    let copy = obj.constructor();
    for (let attr in obj) {
      if (obj.hasOwnProperty(attr)) {
        copy[attr] = obj[attr];
      }
    }
    return copy;
  }
}

(I found this in SO, but honestly couldn't find the original answer.)

Or, maybe other clone solutions could work for you as well.

answered Apr 18, 2018 at 12:26

ForestG

18.2k16 gold badges64 silver badges94 bronze badges

Collectives™ on Stack Overflow

Angular2 - Clone array of typed Object

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related