angular – 如何将子组件传递给父级兄弟组件？

我想在list.component.ts上的@L_352_0@mouSEOver / mouSELEave时显示来自bucket-modal.component.ts的弹出窗口.
如何在list.component.ts和bucket-modal.component.ts之间进行通信？我的代码在这里.

list.component.ts

@Component({    
    SELEctor: 'list',templateUrl: 'list.component.html',styleUrls: ['list.component.css'],})

export class ListComponent implements OnInit {
 @input() state: Boolean;
    @Output() toggle = new EventEmitter();
    onHover() {
    this.state = true;
    this.toggle.emit(this.statE);
    console.log("state is ----------" + this.statE);
    }
    onHoverOut() {
    this.state = false;
    this.toggle.emit(this.statE);
    console.log("state is------ " + this.statE);
    }
}

list.component.html

<a (mouSEOver)="onHover()" (mouSELEavE)="onHoverOut()">random Link list</a>

listdetails.component.ts

@Component({

    SELEctor: 'app-list-detail',templateUrl: 'app-list.component.html',styleUrls: ['app-list.component.css'],})


export class ListDetailComponent implements OnInit {


}

listdetails.component.html

<list [elementslist]="listdetails" lisTingtype="3"></list>
<list [elementslist]="listdetails" lisTingtype="3"></list>
<list [elementslist]="listdetails" lisTingtype="3"></list>
<bucket-modal [(showMeaddBucket)]="show2ClickedBucket" [state]="PopUpshow" (togglE)="PopUpshow=$event"></bucket-modal>

斗modal.component.ts

@Component({    
    SELEctor: 'bucket-modal',templateUrl: 'bucket-modal.component.html',styleUrls: ['bucket-modal.component.css'],})



export class BucketModalComponent implements OnInit {

      @input() state: Boolean;
      @Output() toggle = new EventEmitter();
    onHover() {
        this.state = true;
        this.toggle.emit(this.statE);
        console.log("state is " + this.statE);
    }
    onHoverOut() {
        this.state = false;
        this.toggle.emit(this.statE);
        console.log("state is " + this.statE);
    }
}

export class BucketModalComponent implements OnInit {
  showDialog(): void {
    // Open the popup dialog
  }
}

<list ... (togglE)="modal.showDialog()"></list>
<bucket-modal #modal ... ></bucket-modal>