Angular error when using mediaObserver in Angular 14

Question

I ma getting the following error on my VS Code console after I have upgraded my Angular and Flex version from 12 to 14.

Type 'Observable<void>' is missing the following properties from type 'Subscription': closed, _parentOrParents, _subscriptions, unsubscribe, and 2 more.ts(2740)

 this.cols = this.mediaObserver.asObservable().pipe(
     map((change: MediaChange[]) => {
        this.deviceAlias = change[0].mqAlias;
     })
 )

Does anyone have an idea on how to fix this?

Answer 1

I guess this.cols is declared as a Subscription but this.mediaObserver.asObservable() returns an observable. either you need to add .subscribe() or you need to declare this.cols as an observable.

alos you are using map() incorrectly. map() needs to return something. If you don't need to return anything, use tap() instead