Question

我正在实现从同一个类派生的多个对象之间的“parents-childs”关系。

我的班级（型号）如下：

export class Node {
  public name: string;
  public isLocked: boolean;
  public canBeUnlocked: boolean;
  public parentNodes: Node[];
  public childNodes: Node[];
}

在我的组件下，我声明了从这个模型派生的几个对象，但有些对象在它们的简单声明之前使用了对象：

Test.component.ts

import { Component, OnInit } from '@angular/core';
import {Node} from '../models/node.model';

@Component({
  selector: 'app-mage',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {
  NodesList= [];
  Node1: any;
  Node2: any;
  Node3: any;
  Node4: any;
  Node5: any;
  Node6: any;

  constructor() {
    this.Node1 = new Node('Node1', false, true , null, [this.Node2]);
    this.Node2 = new Node('Node2', true, true, [this.Node1], [this.Node3 , this.Node4]);
    this.Node3 = new Node('Node3', true, false , [this.Node2], [this.Node5]);
    this.Node4 = new Node('Node4', true, false , [this.Node2], [this.Node6]);
    this.Node5 = new Node('Node5', true, false , [this.Node3], null);
    this.Node6 = new Node('Node6', true, false , [this.Node4], null);
    // The list
    this.NodesList = [this.Node1, this.Node2, this.Node3 , this.Node4 , this.Node5 , this.Node6];
  }

  ngOnInit() {
    console.log(this.Node2);
    console.log(this.NodesList);
  }
}

问题在于“子节点”，

Node1 的

例如： Node2 是一个子节点，但是当它被“未定义”时调用console.log(Node1)，可能是因为我在定义 Node2 本身之前，正在调用 Node2 作为 Node1 的属性。

问题与其他节点类似。

有什么想法来解决这个问题吗？ 建议??

Answer 1

它是未定义的，不可能是未定义对象的console.log值。解决方案取决于您的目标。

例如，你可以：

  public parentNodes?: Node[];
  public childNodes?: Node[];
}

这将允许创建没有子节点的对象，因此console.log将输出您的对象，只是没有一些尚未初始化的属性。

或者：

<div> {{ Node2.childNodes?[0] }}  </div>

如果节点有，它将在HTML中显示第一个childNode。

您还可以在其他一些Angular的lifeCycleHook中添加缺少的childNodes：

ngOnInit() {
  this.Node2.childNodes = [this.Node1, this.Node3];
}

ngAfterViewInit() {
  console.log(this.Node2);
  console.log(this.NodesList);
}

Answer 2

您已经发现了问题：在为它们分配值之前使用变量。以这两行为例：

this.Node4 = new Node('Node4', true, false , [this.Node2], [this.Node6]);
...
this.Node6 = new Node('Node6', true, false , [this.Node4], null);

this.Node4在为this.Node6分配值之前尝试使用this.Node6。而且您无法交换这些行，因为this.Node6会在分配值之前使用this.Node4。

解决方案是首先为变量分配正确的值，然后指定它们之间的关系，如下所示：

this.Node4 = new Node('Node4', true, false);
...
this.Node6 = new Node('Node6', true, false);
..
this.Node4.parentNodes = [this.Node2];
this.Node4.childNodes = [this.Node6];
...
this.Node6.parentNodes = [this.Node4];

Angular Typescript：在定义之前使用Object作为另一个Object的属性

2 个答案: