RxJs6:OperatorFunction与MonoTypeOperatorFunction

时间:2018-10-01 15:09:18

标签: angular typescript rxjs6

我有以下代码:

export class EventsChainComponent { 
    eventSubscriber:Subscription;

    constructor (protected eventService: EventService) {}


    public registerComponentsEvent(event:any) {
        // getOnEvent signature
        // (method) EventService.getOnEvent(): Observable<FormEvent>
        this.eventSubscriber = this.eventService.getOnEvent()
            .pipe(filter((formEvent: FormEvent) => {return formEvent.key == event.event}))
            .subscribe((formEvent: FormEvent) => {
                  ..........
            });
    }

编译时,编译器返回以下错误:

  

'MonoTypeOperatorFunction'类型的参数不能分配给'OperatorFunction'类型的参数。

因此,我进行了一些搜索,发现了RxJs6运算符过滤器API:

export declare function filter<T, S extends T>(predicate: (value: T, index: number) => value is S, thisArg?: any): OperatorFunction<T, S>;
export declare function filter<T>(predicate: (value: T, index: number) => boolean, thisArg?: any): MonoTypeOperatorFunction<T>;

如您所见,筛选器有2个重载方法,一个重载OperatorFunction,另一个重载MonoTypeOperatorFunction

有人能告诉我这两种类型之间的区别吗?谁知道我该如何解决这个错误?

注意:FormEvent类是由我创建的,EventServiceEventsChainComponent的导入均相同,引用了同一类。

3 个答案:

答案 0 :(得分:2)

对于其他出现此问题的人:

我有同样的问题。就我而言,问题出在事件对象上。

rxjs和angular / router都有一个事件对象,因此发生名称冲突。 解决此问题的方法是用不同的名称声明@ angular / router事件,然后进行相应的使用。

3.7.0

因此,在此之后:我想使用rxjs.Event时使用{Event as RouterEvent} from '@angular/router'; ,而我想使用@ angular / router.Event时使用Event。 错误消失了:)

希望对您有帮助

答案 1 :(得分:0)

在下面的comment之后,我发现问题是我从相同的文件名导入了该类,但是在src文件夹下的其他文件夹中有相同的文件。

  

MonoTypeOperatorFunction<T>不可分配给的唯一方法   OperatorFunction<T,T>是类型参数-Ts-是   不同。假设该函数在一个字符串中返回Observable<FormEvent>   评论不是特别有用。 FormEvent事件从何而来   从?它与该文件中使用的FormEvent相同吗?是吗   一类?谁知道?不是我。我的猜测是您有两个FormEvent   来自不同库的类。或相同的不同安装   库。

我所做的是删除其中一个文件,错误消失了。

答案 2 :(得分:0)

上述解决方案对我不起作用...我找到了这个

filter((event): event is ActivationEnd => event instanceof ActivationEnd)

归功于 https://gitmemory.com/issue/ReactiveX/rxjs/4947/518146427