【angular随笔】-组件之间的通讯

父子关系通讯:


1、父组件向子组件传入数据 – @Input


可以看到,我们使用装饰器@Input修饰了count属性,这就意味着child-component被使用时期望收到一个名为count的属性,当然不属于自己掌控的范围内要小心行事,别人使用我们的组件时什么情况都可能出现,所以我们为count设置了一个初始值,当父组件没有给我们的count属性传值时,我们就取此初始值。



2、子组件通知父组件数据已处理完成 – @Output、EventEmitter



3、父组件获取子组件的示例 获取子组件的属性和调用器函数





这里是父组件ContactPage 调用子组件SceneFixedTimeTask的testMonthed 函数


4、子组件获取父组件的示例


@Host() @Inject(forwardRef(()=> EditngAndQueringOfScene)) EditngAndQuering:EditngAndQueringOfScene

EditngAndQueringOfScene为父组件 EditngAndQuering为EditngAndQueringOfScene的示例 EditngAndQuering.SceneObj 为父控件的属性


不是父子组件关系:

1、使用消息服务

场景:需要通信的两个组件不是父子组件或者不是相邻组件;当然,也可以是任意组件。

步骤:

新建一个服务,组件A和组件B同时注入该服务;

组件A从服务获得数据,或者想服务传输数据

组件B从服务获得数据,或者想服务传输数据。


2、使用通知

场景:这里涉及到一个项目,里面需要实现的是所有组件之间都有可能通信,或者是一个组件需要给几个组件通信,且不可通过路由进行传参。

设计方式:

使用RxJs,定义一个服务模块MessageService,所有的信息都注册该服务;

需要发消息的地方,调用该服务的方法;

需要接受信息的地方使用,调用接受信息的方法,获得一个Subscription对象,然后监听信息;

当然,在每一个组件Destory的时候,需要


MessageService:


使用:


全部评论

相关推荐

不愿透露姓名的神秘牛友
昨天 15:37
1、这群人晚上 11 点发朋友圈:"凌晨 11 点,三环的灯还亮着。" 实际下班时间:19:30。2、什么是嘉豪呀?我最近在字节实习,没什么时间上网3、同龄人:学校社团、酒吧蹦迪;我:acm、字节/腾讯实习4、别人朋友圈发:“今天不想上课”;我朋友圈发:“今天的班就上到这里啦”,定位:字节跳动5、别人的朋友圈都是到处旅游的定位,我的朋友圈天天都是“字节定位”,还一定要是在【公司的健身房】里拍张照片,实际只练了10分钟,其中凹造型5分钟6、mentor布置任务的时候,别人都是:”好的收到“,我:”是不是要xxxx,xxxx这么做也可以吧,这个技术方案会不会更好些“7、别人书包里装的:王道408、轻薄本、四六级真题。我书包里面装的:显存24GB4090独显gpu(24小时开机运行,屏幕上贴着“字节/腾讯等贴纸”)、速效救心丸(代码报错用)、电棍(熬夜写代码困了用),就很……你们懂吧8、入职大厂第一件事:发朋友圈、发小红书,晒工牌,985计算机硕|字节实习生|可以接咨询|有偿改简历,9、别人的社交软件简介:25岁|男|希望遇见有趣的灵魂;嘉豪的社交软件简介:25岁|程序员|字节跳动工程师|一张佩戴工牌的自拍照大厂嘉豪标配:1. 挂胸前的工牌(地铁里只挂不收,怕你看不见 logo)2. 降噪耳机(不放音乐也戴着,避免别人跟自己说话)3. 印 logo 的电脑包(字节红 / 腾讯蓝 / 阿里橙 / 美团黄)4. 手表(最好显示心率,午饭后必发"步数已破 6,000")
牛客30247842...:因为不好进啊要是大厂随便进哪来这么多人装逼
点赞 评论 收藏
分享
鱼专:别投了,我看到有人点了第二个链接投递,还没退出界面,不合适的邮件就发过来了
点赞 评论 收藏
分享
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务