cannot loop and assign api values in constructor

Question

I have a export type as below:

export type Program{
key: string; value: string;
}

I have array values returning from api as below:

apival = ["abc", "xyz" ...etc]

In my component I am doing this in my constructor

program: Program[];

constructor(private service: Service){
getval = service.apival;
getval.forEach((a) => {
program.push({
key: a, 
value: ""
})})}

Now I want to assign the returned array values as key to the program type. I am doing this with a forEach loop. But, I am getting the following error:

"Cannot read property 'push' of undefined"

Note:I tried to do this in service itself, but I am getting this error : "Cannot Instantiate cyclic dependency"

Any idea, why this happens and what is the best way to assign the getval to the programs[]. Either in service or component.

I dont want to do it on OnInit()

Does this answer your question? Cannot read property 'push' of undefined(…) in angular2 — Heretic Monkey
– Heretic Monkey, Commented Mar 19, 2021 at 17:17

Oscar Ludick · Accepted Answer · 2021-03-19 17:04:45Z

2

Your program: Program[]; needs to be initialized like this program: Array<Program> = new Array<Program>(). Also you could use a map and get a new array.

this.program = getval.map(a=>{return {key:a, value:""}});

answered Mar 19, 2021 at 17:04

Oscar Ludick

8026 silver badges14 bronze badges

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

Comments

Rajesh Kumar · Accepted Answer · 2021-03-19 17:27:03Z

0

program: Program[] = [];

Since program is a class variable, you need to use it with this keyword (this.program).

One line solution with ES6 would be:

this.program = this.service.getval.map(a => {key: a, value: ""});

map will iterate through your given array and returns a new array.

answered Mar 19, 2021 at 17:27

Rajesh Kumar

863 bronze badges

Collectives™ on Stack Overflow

cannot loop and assign api values in constructor

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related