как снять флажок при нажатии определенного события, поступающего из другого компонента

Question

Мне нужна твоя помощь.Я пытаюсь снять флажок при щелчке по событию, исходящему от другого компонента / события, генерирующего внешний компонент, в зависимости от значения выброса. Я хочу снять флажок.

Ниже приведен фрагмент кодакод, который я пробовал, но я получаю нулевое значение и не могу снять отметку.

<mat-menu #childMenu="matMenu" [overlapTrigger]="false">
    <span *ngFor="let child of items">
      <!-- Handle branch node menu items -->
      <span *ngIf="child.children && child.children.length > 0">
        <button mat-menu-item color="primary" [matMenuTriggerFor]="menu.childMenu">
          <span>{{child.displayName}}</span>
        </button>
        <app-menu-item #menu [items]="child.children"></app-menu-item>
      </span>
      <!-- Handle leaf node menu items -->
      <span *ngIf="!child.children || child.children.length === 0">
        <mat-checkbox style="display: block; margin-left: 5px; padding: 5px;"
             id={{child.key}}
             (click)="$event.stopPropagation()" (change)="onSelectMetrics($event, child)">
          <span>{{child.displayName}}</span>
        </mat-checkbox>
      </span>
    </span>
  </mat-menu>

  ngOnInit() {
    this.metricService.metricUnselected
      .subscribe(
        (keyValue) => {
          console.log(`keyValue = ${keyValue}`)
         let element = document.getElementById(keyValue) as HTMLInputElement;
         console.log(element);
         element.checked = false;
        }
      )
  }

Это sample.json, который помогает мне в создании динамического спада, имеет флажок в качестве значения."displayName": "Select Metrics", "children": [ { "displayName": "Cache metrics", "children": [ { "displayName": "Read hit(%)", "key": "rhit_perc" }, { "displayName": "Write hit(%)", "key": "whit_perc", "labelName": "Cache metrics" },

`

Я подписался на событие и получаю выбранное значение.Здесь, в моем случае keyValue, я хочу снять флажок на основе keyValue.