Angular 8，复选框值可以传递给组件吗？不在父母/子女关系中

Question

<input type=checkbox [(ngModel)]="myCheckBox" (ngChanged)="!myCheckBox">

例如，如果我希望上面的代码将“ true”或“ false”的“ checked”值传递给其他组件，因此其内容可以基于“ myCheckBox”做出反应。错误，并且他们没有亲子关系，我有什么办法可以做到这一点？请帮忙，真的很感谢！！！

Answer 1

您可以通过不同的方法来实现它。例如：使用EventEmitter或rxjs（Subject，BehaviourSubject）;

在我的示例中，我是通过BehaviourSubject完成的。stackblitz-link

Answer 2

是，您可以使用rxjs和BehaviourSubject来实现此目的>

您必须在复选框中输入一些值，然后onchange您必须调用一个函数，该函数在另一个组件中通知订阅者。我正在为您编写一个非常基本的示例。

在您的sender.component.html中，您可以这样做

<input type=checkbox [(ngModel)]="myCheckBox" (ngChanged)="!myCheckBox" (change)="notifyOtherComponent()">
然后在service.ts中，您可以这样做

import { BehaviorSubject } from 'rxjs';

private messageSource = new BehaviorSubject('default message');
public currentMessageSubscriber = this.messageSource.asObservable();


notify(message: any) {
   this.messageSource.next(message)
}
并且在sender.component.ts中，您可以这样做

  constructor(private __dataService : DataService){}

  notifyOtherComponent(){
   this.__dataService.notify({msg : 'do something'}) 
  }
并且在您的listener.component.ts中，您可以订阅BehaviourSubject，键入Observable以监听最新的值，像这样

constructor(private __dataService : DataService){}

ngOnInit() {
   this.__dataService.currentMessageSubscriber.subscribe((data : any)=>{
    console.log(data) // output : {msg : 'do something'}
  }) 
}
这样，您将从一个组件将数据发送到可观察的对象，并将该数据侦听到另一个组件。