Angular：类型错误：无法使用 Treeview 读取未定义的属性（读取“forEach”）

Question

I try execute on my view-post.component.ts with treeview

Here is my code

  constructor(private postService: PostService, private activateRoute: ActivatedRoute,
    private commentService: CommentService, private router: Router) {
    this.postId = this.activateRoute.snapshot.params.id;

    this.commentForm = new FormGroup({
      text: new FormControl('', Validators.required)
    });
    this.commentPayload = {
      text: '',
      postId: this.postId
    };
    this.dataSource.data = this.comments;
  }
private _transformer = (node: CommentPayload, level: number) => {
  return {
    expandable: !!node.dtoList && node.dtoList.length > 0,
    username: node.username,
    text: node.text,
    level: level,
  };
};

treeControl = new FlatTreeControl<ExampleFlatNode>(
  (node) => node.level,
  (node) => node.expandable
);

treeFlattener = new MatTreeFlattener(
  this._transformer,
  (node) => node.level,
  (node) => node.expandable,
  (node) => node.dtoList
);

dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);


hasChild = (_: number, node: ExampleFlatNode) => node.expandable;
}

I only want show something in console for every item is on "treeview" but show me this error My code base on this project Stackblitz * https://stackblitz.com/edit/angular-rtzh5a?file=src%2Fapp%2Ftree-flat-overview-example.html

Answer 1

Cannot read properties of undefined (reading "forEach")

Meaning that there is a place in your code, where you are using foreach on some array, which is null or undefined. Provided code sample doesn't contain this part, but if you will run app with 'ng serve' (on localhost), this console error will provide you also a component name and on which line problem occoured. For now it's saying main.js:1, because it's built version. You can easily secure it like this:

if (something) {
  something.forEach(s => {
    // ...
  });
}

or use forof loops (like the example above, it just won't run when something is null/undefined)

for (let s of something) {
  // ...
}