Copy Array from http request to other array in Angular

Question

I pretty new to angular and I have a question. I need 2 arrays for ng2-charts, one with labels and one with data.

I make http request to AWS and I got this json

 {
    "System1": [
        {
            "name": "MF3",
            "descr": "Multifilo MF3",
            "speed": [1,2,3,4],
            "time": ["10.01", "10.02", "10.03", "10.04"]
        }
    ]
}

I assing all the result to result: Array<SystemModel>;

For use speed and time on ng2-charts I have to copy the two array speed and time on new array: public lineChartSpeed: Array<number> = []; and public lineChartTime: Array<any> = [];

How can I copy this 2 array on my new array? I know how to access to data only on html template, but not on typscript file...

My component is:

public lineChartSpeed: Array<number> = [];
lineChartTime: Array<any> = [];

result: Array<ImpiantoModel>;

  getdata() {
    this.http.get<SystemModel[]>(this.myUrl)
      .subscribe(
        data => { this.result =  data;

           // perform the copy of speed and time on lineChartTime and lineChartSpeed
          });

  }

How can I copy the array? If you need more details, please ask in the comments! thank you !

M Shafique · Accepted Answer · 2018-01-18 11:03:35Z

2

var system1 = {
    "System1": [
        {
            "name": "MF3",
            "descr": "Multifilo MF3",
            "speed": [1,2,3,4],
            "time": ["10.01", "10.02", "10.03", "10.04"]
        }
    ]
}
var speed = system1.System1[0].speed
var time = system1.System1[0].time
console.log('Array of Speed', speed)
console.log('Array of Time', time)

//Merge or concatenate two Arrays
var newArray = [...speed, ...time]
console.log('Merged or concatenated Arrays', newArray)

edited Jan 18, 2018 at 11:03

answered Jan 18, 2018 at 10:52

M Shafique

8168 silver badges18 bronze badges

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

6 Comments

Nicolò Scapin Over a year ago

It works!! Thanks, it Works! now I can manage my data!! I really appreciate your help! Can I ask you one more question? on your code there is: System1, How can I copy the array time and speed if I change this value? maybe for other system it can be System2... thank again

M Shafique Over a year ago

Am so sorry, i don't get your question. Do you mean if the object like System1 is changed?

Nicolò Scapin Over a year ago

no problem. I have 5 systems and when I make http get I have "System1": [....], , "System2": [....], , "System3": [....], , "System4": [....], how can I tell to mycomponent.ts it is different? On my component I have public name = 'System1' or public name = 'System2' according to the system i'm requesting. thanks

M Shafique Over a year ago

Valid Question. You can get all the keys from object in Array with Object.keys(system1) Object.keys(system1) will return array like ['System1', 'System2', 'System3'], then you can use loop to get all the items. Did i make it clear?

Nicolò Scapin Over a year ago

very clear! but I have an error. I wrote: const tmp = Object.keys(data); console.log(tmp); and it print on console log correctly System1 but if I put on var speed = system1.tmp[0].speed . On compiler I have this error: TS2339: Property 'tmp' does not exist on type 'SystemModel'. ps: I gave you best answer, I really appreciate!

|

deepak thomas · Accepted Answer · 2018-01-18 10:41:28Z

1

Use slice operator to create a new copy of the array

     this.result =  data.slice();

answered Jan 18, 2018 at 10:41

deepak thomas

1,1909 silver badges25 bronze badges

3 Comments

Nicolò Scapin Over a year ago

but I need a copy of speed and time not the entire array! and when I get a copy of all array, how can I continue for have single array?

deepak thomas Over a year ago

then you have to slice the time and speed sperately an assign to a variable like

deepak thomas Over a year ago

var result ={time:system1.System1[0].time.slice(),speed:system1.System1[0].speed.slice()}

Vishal · Accepted Answer · 2018-01-18 11:02:23Z

0

this.lineChartSpeed = [].concat(this.result[0].speed);
this.lineChartTime = [].concat(this.result[0].time);

edited Jan 18, 2018 at 11:02

answered Jan 18, 2018 at 10:44

Vishal

11k22 gold badges90 silver badges136 bronze badges

3 Comments

Nicolò Scapin Over a year ago

With your code I have and error: error TS2339: Property 'System1' does no t exist on type 'SystemModel[]'.... I alreadytried this solution!

Vishal Over a year ago

answer edited @NicolòScapin If that does not work, could you please console the data param?

kayess Over a year ago

While this code snippet may solve the question, including an explanation really helps to improve the quality of your post. Remember that you are answering the question for readers in the future, and those people might not know the reasons for your code suggestion. Please also try not to crowd your code with explanatory comments, this reduces the readability of both the code and the explanations!

Collectives™ on Stack Overflow

Copy Array from http request to other array in Angular

3 Answers 3

6 Comments

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related