Im trying to push values from an array with objects to another array with objects

Question

I have multiple slides and based on those slides i want to make links that go to the slides but i want the generation of the navigation links to go automatic and its not working

im kinda new at angular and typescript so im at a loss

this is the generation of the links:

export class LinksComponent implements OnInit {
  links:Link[];

  constructor(private sS:SlidesService) { }

  ngOnInit() {
    let slides = this.sS.getSlides();
    for (let s of slides) {
      let obj = {} as Link;
      obj.name = s.name;
      obj.href = "#" + s.name;
      obj.selected = false;
      this.links.push(obj);
    }
  }

}

sS is a service and the getSlides calls this function:

getSlides() {
    return [
      {
        name: "home",
        index: 1,
        selected:true,
        background:"url(bg_home.jpg)"
      },
      {
        name: "me",
        index: 2,
        selected:true,
        background:"url(bg_me.jpg)"
      },
      {
        name: "projects",
        index: 3,
        selected:true,
        background:"url(bg_projects.jpg)"
      }
    ]
  }

i get this error ERROR typeError: cannot read property 'push' of undefined even though i defined links(the array im trying to push objects in) now i have looked for some answers but im at a loss. any help would be much appreciated

I want it to work so my links get dynamically made from the amount of slides with the corresponding name and stuff.

fjc · Accepted Answer · 2019-07-03 10:41:18Z

3

You have defined, but not initialized the array.

The example, boiled down to the issue:

test.ts

let links: Link[];

Is compiled to a test.js:

var links;

As you can see, links is not defined and therefore is undefined.

To solve the issue, initialize links as an empty array:

test2.ts:

let links: Link[] = [];

compiles to:

var links = [];

Here's a TypeScript Playground showing the behavior.

answered Jul 3, 2019 at 10:41

fjc

5,84521 silver badges38 bronze badges

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

Comments

Gopesh Sharma · Accepted Answer · 2019-07-03 10:38:10Z

1

This is because you have not defined your Links array, use something like below :

links:Link[] = [];

You are trying to push a new element to an undefined array thus getting the error as "cannot read property 'push' of undefined".

answered Jul 3, 2019 at 10:38

Gopesh Sharma

7,0604 gold badges27 silver badges35 bronze badges

1 Comment

Fam Over a year ago

Appreciate all the fast answers

Shifenis · Accepted Answer · 2019-07-03 10:39:59Z

1

Links is undefined, in fact in your code there is:

 links:Link[];

To be able to push something in your array you must declare it as:

 links:Link[] = [];

Or if you don't want to declare it , you have to assign value to it

answered Jul 3, 2019 at 10:39

Shifenis

1,12512 silver badges24 bronze badges

1 Comment

Fam Over a year ago

Thanks i mean it makes sense now

cnps · Accepted Answer · 2019-07-03 11:01:59Z

As the others have point out, you need to initialize links, before you can push into it.

Alternatively, you could do something like the example below, and you wouldn't need to initialize an empty array.

export class LinksComponent implements OnInit {
  links:Link[];

  constructor(private sS:SlidesService) { }

  ngOnInit() {

    // you want to use "const", when you are not resetting the value. 
    // Also a good idea to slap a type on what you get from your api requests.

    const slides: Slide[] = this.sS.getSlides();
    this.links = slides.map((s: Slide) => {
       return {
                 name: s.name,
                 href: '#' +s.name,
                 selected: false,
              }
    });
  }
}

tamar · Accepted Answer · 2019-07-03 11:17:37Z

0

Juat add in the constructor:

export class LinksComponent implements OnInit {
  links:Link[];

  constructor(private sS:SlidesService) {
       this.links=[];
 }

  ngOnInit() {
    let slides = this.sS.getSlides();
    for (let s of slides) {
      let obj = {} as Link;
      obj.name = s.name;
      obj.href = "#" + s.name;
      obj.selected = false;
      this.links.push(obj);
    }
  }

}

and every thing will work fine.

(Of course, this comment is correct for the initialization of any object to which you want to insert values. You need to reformat it in its default value.)

answered Jul 3, 2019 at 11:17

tamar

1825 bronze badges

Collectives™ on Stack Overflow

Im trying to push values from an array with objects to another array with objects

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related