Question

在WPF-Prism框架中一直在寻找类似 IEventAggregator 的东西。

除了在Angular 5中寻找解决方案之外，

This在我的脑海中有点同样的问题。

到目前为止，还没有找到一个简单的解决方案。不得不使用打字稿泛型，角度依赖注入使用服务和＆＃34; rxjs / Subject＆＃34; 创建一个。

主要受this帖子启发。

创建名为EventService的服务，并将其注册为AppModule中的依赖项。由于它被添加到NgModule.providers的{{1}}列表中，因此可以将其解析为任何组件中的依赖项。

EventService：

AppModule

其中IEvent和Event是：

/**
 * For inter component communication throughout application.
 * Use dependency injection to raise an event with payload.
 * NOTE: All subscriptions to be unsubscribed at ngOnDestroy() method of subscribing component
 */
@Injectable()
export class EventService {

    private someDataChangeEvent: IEvent<string> = new Event<string>();

    constructor() { }

    public get someDataChange(): IEvent<string> {
        return this.userImageChangeEvent;
    }

}

在发布组件

1.Constructor - 解决依赖：

import { Subscription } from "rxjs";
import { Subject } from "rxjs/Subject";

export interface IEvent<T> {

    /**
     * Method which will signal the subscribers.
     * @param payload 
     */
    publish(payload: T): void,

    /**
     * Registers the payload receiving function.
     * NOTE: Subscribing component should handle the subscription disposal on ngOnDestroy method.
     * @param callback: callback function 
     */
    subscribe(callback: (payload: T) => void): Subscription
}

export class Event<T> implements IEvent<T> {

    private subject = new Subject<any>();

    constructor() { }

    public publish(payload: T): void {
        // Notify subscribers.
        this.subject.next(payload);
    }

    public subscribe(callback: (payload: T) => void): Subscription {
        // Create a subscription with the passed callback
        let subscription = this.subject.asObservable().subscribe(callback);
        return subscription;
    }
}

数据更改时发布事件。比如说，httpClient完成或下拉项目更改或按钮单击。 constructor( private readonly _eventService: EventService ) { }是您要发送给订阅组件的数据。
```
payload
```

现在，在订阅组件

实施OnInit和OnDestroy
构造函数 - 解决依赖关系，与上面相同
在ngOnInit方法中，订阅事件

在ngOnDestroy取消订阅订阅中。

self._eventService.someDataChange.publish(payload);

我可以定义与应用程序需求一样多的不同事件，并且多个组件可以订阅这些事件。但是我需要在ngOnDestroy方法中小心处理所有这些订阅。

有没有办法避免它？有没有办法自动删除订阅，在组件销毁时没有明确地执行它。

在应用程序中有一个或两个事件，这很好用。但是在export class SomeComponent implements OnInit, OnDestroy { constructor( private readonly _eventService: EventService ) { } private eventSubscription: Subscription = null; ngOnInit() { this.eventSubscription = this._eventService.someDataChange.subscribe((payload) => { // Do something with payload }); } ngOnDestroy() { this.eventSubscription.unsubscribe(); } }中注册了10多个事件，多个组件订阅了大部分事件，我怀疑这是一个很好的解决方案吗？

我有什么选择？至少，自动取消订阅处理组件将是一个很大的帮助。谢谢。

Angular 5应用程序的Pub-Sub实现

0 个答案: