介绍 <李> ng g service 事件 import {, Injectable },得到& # 39;@angular/核心# 39;;
{},Subject import 得到& # 39;rxjs& # 39;;
@Injectable ({
providedIn才能:& # 39;根# 39;
})
export class EventService {//,才能构建主题的实例,用来完成事件的发布和订阅
private 才能;subject =, new subject & lt;, any 祝辞,();
构造函数(),才能{}
发布才能(价值:,,,犯错:,有的话),{
,,,if (value !==,未定义),{
,,,,,//,将新的事件放入下一个队列中
,,,,,this.subject.next(价值);
,,,}
,,,if (err !==,未定义),{
,,,,,//,将错误放队入误差列
,,,,,this.subject.error(错);
,,,}
,,,//,表示当前事件结束
,,,this.subject.complete ();
,,}
subcribe才能(处理程序:{
,,:,(值),=祝辞,空虚,
,,,错误:(err),=祝辞,空虚,
,才能完成:,(),=祝辞,空白
}),{才能
,,,this.subject.asObservable () .subcribe(处理器);
,,}
} @NgModule ({
,声明:[],
,进口:[],
提供者:大敌;[EventService],
,引导:[AppComponent]
})
{export class AppModule } export class AComponent implements OnInit {
,构造函数(
private 才能;事件:EventService
,){,}
,ngOnInit (), {
,}
,someThingChanged(数据),{//,才能发布事件
this.event.publish({才能
,,//,可以定义一个事件类型,实现多个不同类型事件的发布
,,,类型:& # 39;event_type_you_want_define& # 39;
,,//,可以携带任何数据,并通过事件发布出去
,,,数据:数据,
,,,别人:& # 39;ohter things 你want 用pass 本# 39;
,,},犯错);
,}
} export BComponent implements OnInit {
,构造函数(
private 才能;事件:EventService
,){,}
,ngOnInit (), {
,,//,在初始化方法中,可以完成对事件的订阅工作
this.event.subject({才能
,,:,value =祝辞,{
,,,//,可以通过约定事件类型,在这里进行检查,从而完成不同的逻辑
,,,//,do something with 价值
,,},
,,,错误:err =祝辞,{
,,,//handle 犯错
,,},
,才能完成:,(),=祝辞,{
,,,//,handle 完成
,,}
})才能
,}
}
怎么在角中实现不同组件间的数据传递吗?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
<>强利用角事件在不同组件之间传递数据
为了实现在角不同组件之间相互传递数据,可以使用事件分发的思路来实现。
使用事件实现在不同组件之前传递数据的思路如下:
定义一个服务,用来实现事件的发布和订阅方法。
<李>组件一注入事件服务的依赖,将自己要传递数据的数据以事件的形式发布出去。
<李>组件B注入事件服务的依赖,并订阅相关事件。
<强>定义一个服务
在终端输入
角会自动在项目的应用目录下生成event.service。ts和event.service.spec。ts两个文件。
我们在event.service。ts文件中完成相关业务代码即可。
例如,我们在改服务中实现发布事件和订阅事件的方法:
最后,为了能让我们定义的服务能够被注入到其他组件中,我们还需要在app.modules。ts文件中注册我们的服务:
<强>利用EventService在不同组件间传递数据
假定组件一个中的数据需要传递到组件B中,这里的数据可以是事件,文本内容,状态改变等等东西。则在组件中,我们可以发布一个事件,组件B订阅该事件即可。
在组件一个中发布事件
在组件B中订阅事件
看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注行业资讯频道,感谢您对的支持。
