Угловое различение нескольких узлов дерева

Question

Я занимаюсь разработкой веб-приложения на Angular.У меня есть компонент дерева на странице.У меня есть динамические вкладки и содержимое в виде узлов дерева.Я изо всех сил, чтобы различать узлы.Ниже приведен код динамической вкладки и дерева.

Ниже приведен машинописный код:

this.arrayTabs.forEach(eachObj => {
  this.tabs.push({
    title: eachObj,
    active: false,
    content: this.nodes
  });
}) 

Ниже приведен HTML-код:

<tabset>
  <tab *ngFor="let tabz of tabs" [heading]="tabz.title">
    <div *ngIf="tabz.title==='Edit'">
      <tree-root #tree
        [nodes]="tabz.content"
        [options]="options">
        <ng-template #treeNodeTemplate let-node="node" let-index="index">
          <input type="checkbox" (change)="toggle($event.target,node)"
[checked]="node.data.checked">
          {{ node.data.name }}"
        </ng-template>
       </tree-root>
     </div>
   </tab>
</tabset>

Это дерево выглядит следующим образом:

Проблема, с которой я сталкиваюсь, как показано ниже.Когда я нажимаю на чекбокс infomodel на вкладке «Добавить», также будет установлен флажок на вкладке «Удалить» или на других вкладках.Ниже мое флажок отмечен событием.

toggle(cb, node, tabtitle) {
  if (cb.checked) {
    node.data.checked = true;
  }
  else {
    node.data.checked = false;
  }
}

Это происходит потому, что когда я выполняю node.data.checked=true или false, все узлы обновляются.Есть ли способ, которым я могу предотвратить это?В идеале узлы должны быть разными для каждой вкладки.Правильный ли метод, которым я следую, или мне следует изменить мою реализацию?