Question

我有多张幻灯片，根据这些幻灯片，我想建立指向这些幻灯片的链接，但是我希望导航链接的生成能够自动进行并且不起作用

我在角度和打字稿上有点新，所以我茫然无措

这是链接的生成：

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是一项服务，getSlides调用此函数：

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)"
      }
    ]
  }

我收到此错误错误typeError：无法读取未定义的属性“ push” 即使我定义了链接（试图将对象推入的数组）现在我一直在寻找一些答案，但即时通讯无所适从。任何帮助将不胜感激

我希望它能正常工作，以便从带有相应名称和内容的幻灯片数量中动态创建链接。

Answer 1

您已定义但未初始化数组。

该示例归结为以下问题：

test.ts

let links: Link[];

已编译为 test.js ：

var links;

如您所见，links未定义，因此为undefined。

要解决此问题，请将links初始化为空数组：

test2.ts ：

let links: Link[] = [];

编译为：

var links = [];

Here's a TypeScript Playground showing the behavior.

Answer 2

这是因为您尚未定义Links数组，请使用以下内容：

links:Link[] = [];

您正在尝试将新元素推送到未定义的数组，因此得到的错误为“无法读取未定义的属性'push'”。

Answer 3

Links未定义，实际上在您的代码中有：

 links:Link[];

要能够push数组中的某些内容，必须将其声明为：

 links:Link[] = [];

或者如果您不想声明它，则必须为其赋值

Answer 4

正如其他人指出的那样，您需要先初始化链接，然后才能将其推入。

或者，您可以执行以下示例，而无需初始化一个空数组。

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,
              }
    });
  }
}

Answer 5

Juat添加构造函数：

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);
    }
  }

}

一切都会很好。

（当然，此注释对于要向其插入值的任何对象的初始化都是正确的。您需要将其重新格式化为默认值。）

我试图将值从具有对象的数组推到具有对象的另一个数组

5 个答案: