我如何在 Angular dart 中的同级组件之间共享数据

How do i share data between sibling components in Angular dart

如何在 Angular dart

中将数据共享给兄弟组件

如何在同级组件之间动态共享数据 能否举例说明一下

谢谢。

  • 您可以使用父组件或另一个共同祖先提供的共享服务,将其注入两个组件并将其用作中介,例如使用流主动通知状态更改。

  • 您还可以在传递给两者的父组件中使用一个字段

<sibling1 [data]="dataInParent"></sibling1>
<sibling2 [data]="dataInParent"></sibling1>
  • 可以在父组件的模板中引用use references
<sibling1 #foo1></sibling1>
<sibling2 [data]="foo1.data"></sibling1>
<comp-root>
  <comp-a #foo ></sibling>
  <comp-b [data]="foo.passData()"></sibling>
</comp-root>

@Component(
  selector: 'comp-root',
  styles: [],
  template: '''
  <comp-a #foo ></sibling>
  <comp-b [data]="foo.passData()"></sibling>
''',
)
Class CompRoot {
    // do someting...


}

@Component(
  selector: 'comp-a',
  styles: [],
  template: ''' <a (click)="changeA()"> click 1</a> <a (click)="changeB()"> click 2</a> ''',
)
Class CompA {
  String pData;

  @Output
  String passData() => pData

  void changeA() => pData = 'Staf-1';
  void changeB() => pData = 'XYZ';
}

@Component(
  selector: 'comp-b',
  styles: [],
  template: ''' {{data}} ''',
)
Class CompB {

  @Input
  String data;

}