angular中的组件通讯

前因:在ng-alain项目中自定义菜单组件,并且使用了reuse-tab,发现切换reuse-tab左侧的自定义菜单没有切换。

解决办法:监听路由变化,然后去切换菜单

解决思路:

  1. Angular的@Input和@Output,但是只能在父子组件之间共享变量
  2. 使用localStorage+轮询机制实现;
  3. 使用发布订阅模式;

在这里我选择的是rxjs发布订阅。如果你不知道怎么写,那看下面代码吧!

首先:创建一个service作为媒介:public.service.ts

接着:在发布者组件中,发布消息:在app.component.ts中,引入public.service.ts并发布

最后:在订阅组件中,订阅消息:sidebar.component.ts。然后处理相关逻辑

     

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...