How to resolve Angular Error with async pipe?

Question

I am currently experiencing a problem with angular, if i use a several pipe in addition to async pipe like that :

      <p>Mis à jour : {{ lastUpdate | async | date: 'yMMMMEEEEd' | uppercase }}</p>

the code can't compile and i have this error :

Error: src/app/app.component.html:5:39 - error TS2769: No overload matches this call. Overload 1 of 3, '(value: string | number | Date, format?: string | undefined, timezone?: string | undefined, locale?: string | undefined): string | null', gave the following error. Argument of type 'unknown' is not assignable to parameter of type 'string | number | Date'. Type 'unknown' is not assignable to type 'Date'. Overload 2 of 3, '(value: null | undefined, format?: string | undefined, timezone?: string | undefined, locale?: string | undefined): null', gave the following error. Argument of type 'unknown' is not assignable to parameter of type 'null | undefined'. Type 'unknown' is not assignable to type 'null'. Overload 3 of 3, '(value: string | number | Date | null | undefined, format?: string | undefined, timezone?: string | undefined, locale?: string | undefined): string | null', gave the following error. Argument of type 'unknown' is not assignable to parameter of type 'string | number | Date | null | undefined'. Type 'unknown' is not assignable to type 'Date'.

any idea where the problem may come from?

lastUpdate = new Promise((resolve, reject) => {
    const date = new Date();
    setTimeout(
        () => {
            resolve(date);
        }, 2000
    );
});

This is not the issue with chaining pipes. your lastUpdate variable is unknown. Share complete code. From where is lastUpdate value is coming? — zainhassan
– zainhassan, Commented Nov 18, 2021 at 9:08
the problem comes from this :" Type 'unknown' is not assignable to type 'Date'.", you need to make sure that date variable has a Date type — Massi Issar
– Massi Issar, Commented Nov 18, 2021 at 9:36
off topic, but this is the short version of your code: new Promise(resolve => setTimeout(resolve, 2000, new Date())); setTimeout supports function arguments for the callback — Thomas
– Thomas, Commented Nov 18, 2021 at 13:17

JSON Derulo · Accepted Answer · 2021-11-18 10:59:10Z

1

You are creating a promise without specifying, which type the resolved value should have, therefore it is typed as unknown. However, the date pipe does not accept type unknown.

Add type Date to the promise like the following:

lastUpdate = new Promise<Date>( //...

answered Nov 18, 2021 at 10:59

JSON Derulo

18.8k11 gold badges62 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to resolve Angular Error with async pipe?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related