Angular 4 Fehler: Kann Eigenschaft 'push' von undefined nicht lesen

Question

Ich arbeite an einer Angular 4 App, wo ich versuche, Daten in ein Array zu pushen, aber weiterhin den Fehler ERROR TypeError: Cannot read property 'push' of undefined bekommen, obwohl ich das Array initialisiert habe.

Hier ist der Code:

import {Component, OnInit} from '@angular/core'; 

declare let d3:any; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.scss'] 
}) 
export class AppComponent implements OnInit { 

    //Initialized array here 
    networkLinkList: Array<any> = []; 
    ngOnInit() { 
    this.networkGraph(); 
    } 

    networkGraph() { 
    d3.netJsonGraph("../assets/json/network.json", 
     { 
     onClickNode: (url, opts) => { 
      this.highlightNodes(url, "nodes", true); 
     } 
     } 
    ); 
    } 

    highlightNodes(url, type, initial) { 
    let url_children = url.children; 

    if(type === "nodes") { 
     let clicked_node_object = { 
            name: url.name, 
            description: url.description, 
            level: url.level, 
            link: url.url 
           }; 
     //Push here is working fine 
     this.networkLinkList.push(clicked_node_object); 
     //Can see the array values here 
     console.log(this.networkLinkList); 

     d3.selectAll(".njg-node").filter(function(d) { 

     if(url_children.length > 0) { 
      for(let child=0; child<url_children.length; child++) { 
      if(d.id == url_children[child]) { 

       //Can see the all the values here 
       console.log(d.name + ", " + d.description + ", " + d.level + ", " + d.url); 
       let child_node_object = { 
       name: d.name, 
       description: d.description, 
       level: d.level, 
       link: d.url 
       }; 

       //Push here is throwing the error 
       this.networkLinkList.push(child_node_object); 
      } 
      } 
     } 
     return ((url.children.length > 0 && (d.level === url.level + 1))); 
     }); 
    } 
} 

Bitte helfen Sie mir dieses Problem zu beheben, wie ich bin nicht sicher, warum der Fehler ausgelöst wird, auch wenn das Array initialisiert wird.

Answer 1

this zum function gets a this according to the calling context,, nicht die networkLinkList,

aber die arrow functions halten die dies der Kontext der Definition bezieht.

den Pfeil Funktion in diesem Fall verwenden,

d3.selectAll(".njg-node").filter((d) => { 

}