Question

我有两个组件componentA和componentB。他们都是sibbling，并且是componentMother的孩子。

我想这样做，当我点击componentA上的按钮时，它会触发componentB上的函数调用。

使用具有observable的服务并让componentA发出componentB订阅的事件或者是否有更好/最佳实践方式的方法？

Answer 1

我可能会使用使用Subject的服务。通过这种方式，它既可以发布到

也可以订阅

import { Subject } from 'rxjs/Subject';

class SomeService {
  private _subject = new Subject<any>();

  newEvent(event) {
    this._subject.next(event);
  }

  get events$ () {
    return this._subject.asObservable();
  }
}

您的组件可以发布，也可以订阅

@NgModul({
  providers: [ SomeService ]
})
class AppModule {}

@Component()
class ComponentOne {
  constructor(private service: SomeService) {}

  onClick() {
    service.newEvent('clicked!');
  }
}

@Component()
class ComponentTwo {
  constructor(private service: SomeService) {}

  ngOnInit() {
    this.service.events$.forEach(event => console.log(event));
  }
}

另见：

Getting Started on Subjects

Answer 2

使用 RxJS SUBJECT（~EventEmitter）： import { Subject } from 'rxjs/Subject';

主题服务将允许您为父组件及其子组件启用双向通信。

参考：https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service

有关

的更多详情

RxJs SUBJECT

检查一下：https://www.youtube.com/watch?v=rdK92pf3abs

如何在angular2中触发从一个组件到另一个组件的功能？

2 个答案: