Angular 组件之间的通讯问题。

Question

大致想实现的就是修改用户名的时候右上角可以监视到这个变化也更新用户名（中文社区好像没有做这个...）

我刚开始看了@input和@Output
内部子组件：

@Input() realname:string = this.userInfo.name;
@Output() changeRealname:EventEmitter<string> = new EventEmitter();
this.changeRealname.emit(this.realname);

但是有很多子页面切换，用户设置只是其中之一，我使用的是<router-outlet></router-outlet>所以我就不知道应该把本应放在子组件标签里面的监听事件加在哪儿

后来我搜到了@viewChild，但是还是因为使用的路由吧？= =所以我在父组件里面这样使用

@ViewChild(userSetsComponent)  private userSets: userSetsComponent;  
ngAfterViewInit() {
   console.log( this.userSets);
  }

结果是undifind
求大神解惑

Answer 1

<router-outlet (activate)="onActivate($event)"></router-outlet>

onActivate(userSetsComponent){
    if(userSetsComponent.userInfo){
      this.userInfo=userSetsComponent.userInfo;
      this.realname = this.userInfo.name;
    }
  }

后来使用了这个，然后子组件内保存修改的时候刷新页面
但是感觉不太好，希望能有更好的思路

30分钟以后补充回答：
后来使用了服务
https://stackoverflow.com/que...