Javascript 如何使一个父对象具有子对象，在该子对象中，每个父对象只能选择一个子对象

代码如下：

从'@angular/core'导入{Component}；
@组成部分({
选择器：“nz demo select hide selected”，
模板：`
`,
风格：[
`
新西兰选择{
宽度：100%；
}
`
]
})
导出类NzDemoSelectHideSelectedComponent{
ListoOption=[‘项目1’、‘项目2’、‘项目3’、‘项目4’]；
listOfSelectedValue:字符串[]=[]；
isNotSelected（值：字符串）：布尔值{
返回此.listOfSelectedValue.indexOf（value）=-1；
}
}

我想在这里做的是，当您选择“项目1”时，会有另一列或子列，它将选择它是什么组，例如组1、组2或组3，但它只能选择1个组并选择项目，它可以选择与“项目1”相同的另一个项目它有一个组，在该组中，它可以选择它所属的组1、组2或组3

输出应如下所示：

---

你的最后一段令人困惑。你能在stackblitz中创建一个硬编码的模型吗？@KurtHamilton类似于SelectTree类似于此，但它只从子对象中选择1，而父对象不应该是可选的。首先只能选择孩子，然后使用该控件可能会更好。文档看起来很好，而且看起来是可配置的。如果你还在挣扎，你应该在[ng zorro antd]标签上张贴关于ng zorro的问题。这不是一般的角度或Javascript问题。

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

@Component({
  selector: 'nz-demo-select-hide-selected',
  template: `
    <nz-select nzMode="multiple" nzPlaceHolder="Inserted are removed" [(ngModel)]="listOfSelectedValue">
      <nz-option
        *ngFor="let option of listOfOption"
        [nzLabel]="option"
        [nzValue]="option"
        [nzHide]="!isNotSelected(option)"
      ></nz-option>
    </nz-select>
  `,
  styles: [
    `
      nz-select {
        width: 100%;
      }
    `
  ]
})
export class NzDemoSelectHideSelectedComponent {
  listOfOption = ['Project 1', 'Project 2', 'Project 3', 'project 4'];
  listOfSelectedValue: string[] = [];

  isNotSelected(value: string): boolean {
    return this.listOfSelectedValue.indexOf(value) === -1;
  }
}