How to specify which pipe to use if multiple modules exported same name pipes?

Question

In my project, I'm using NgxExtendedPdfViewerModule & TranslateModule(@ngx-translate/core). Both packages export translate pipe.

The translate pipe from NgxExtendedPdfViewerModule returns Promise<string>. And, the translate pipe from TranslateModule returns string.

In a module I have to use both to show some pdfs. Now, how do I specify which pipe to use?

score 0 · Answer 1 · edited Mar 07 '22 at 11:19

0

imports can also be renamed

import { translate as translate1 } from "./NgxExtendedPdfViewerModule";
import { translate as translate2 } from "./TranslateModule";

edited Mar 07 '22 at 11:19

Elikill58

4,050
24
23
45

answered Mar 07 '22 at 10:51

Asad Rehman

19
2

I am importing the modules like this: `NgxExtendedPdfViewerModule, TranslateModule.forChild()` in my projects module, not importing the pipes themselves directly. – Anup K. Tarafder Mar 07 '22 at 13:42

score 0 · Answer 2 · edited Mar 10 '22 at 02:29

Try This

import { Pipe } from '@angular/core';
import { translate as translate1 } from "./NgxExtendedPdfViewerModule";
import { translate as translate2 } from "./TranslateModule";

@Pipe({ name: 'translate1' })
export class Translate1Pipe extends translate1 { }

@Pipe({ name: 'translate2' })
export class Translate2Pipe extends translate2 { }

Declare the Pipes in Modules and use it inside template

<h1>{{'TEST'| translate1}}</h1>
<h1>{{'TEST2'| translate2}}</h1>

How to specify which pipe to use if multiple modules exported same name pipes?

2 Answers2