My Pipe is located in
apps\administrator\src\app\modules\messenger\pipes\custom-message.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
/**
* Pipe for Custom Message for boolean
*/
@Pipe({
name: 'customMessage',
})
export class CustomMessagePipe implements PipeTransform {
public transform(value: boolean, trueString: string, falseString: string): string {
//The code
}
}
In the main module
apps\administrator\src\app\app.module.ts
file:
import { CustomMessagePipe } from './modules/messenger/pipes/custom-message.pipe';
...
@NgModule({
declarations: [..., CustomMessagePipe],
providers: [...],
})
export class AppModule {}
I now have two modules named FormSmsModule
and FormSmtpModule
FormSmsModule
is located in
apps\administrator\src\app\modules\messenger\form-sms
FormSmtpModule
is located in
apps\administrator\src\app\modules\messenger\form-smtp
Referring to this answer here
In the file apps\administrator\src\app\modules\messenger\form-sms\form-sms.module.ts, utilizing CustomMessagePipe
in the imports
array, I have:
import { CustomMessagePipe } from '../pipes/custom-message.pipe';
@NgModule({
declarations: [...],
imports: [
...,
CustomMessagePipe,
FormSmsRoutingModule,
],
providers: [...],
})
export class FormSmsModule {}
In the file apps\administrator\src\app\modules\messenger\form-smtp\ form-smtp.module.ts, using CustomMessagePipe
in the imports
array, I have:
import { CustomMessagePipe } from '../pipes/custom-message.pipe';
@NgModule({
declarations: [...],
imports: [
...,
CustomMessagePipe,
FormSmtpRoutingModule,
],
providers: [...],
})
export class FormSmtpModule {}
Encountering an error mentioned in this question here
ERROR in apps/administrator/src/app/modules/messenger/pipes/custom-message.pipe.ts:10:14 - error NG6002: Appears in the NgModule.imports of FormSmsModule, but could not be resolved to an NgModule class.
Is it missing an @NgModule annotation?
10 export class CustomMessagePipe implements PipeTransform {
~~~~~~~~~~~~~~~~~
** Angular Live Development Server is listening on localhost:4202, open your browser on http://localhost:4202/ **
Trying an alternative method as provided here
In the file apps\administrator\src\app\modules\messenger\form-sms\form-sms.module.ts, including CustomMessagePipe
in the declarations
array, I have:
import { CustomMessagePipe } from '../pipes/custom-message.pipe';
@NgModule({
declarations: [..., CustomMessagePipe],
imports: [
...,
FormSmsRoutingModule,
],
providers: [...],
})
export class FormSmsModule {}
In the file apps\administrator\src\app\modules\messenger\form-smtp\form-smtp.module.ts, adding CustomMessagePipe
to the declarations
array, I have:
import { CustomMessagePipe } from '../pipes/custom-message.pipe';
@NgModule({
declarations: [..., CustomMessagePipe],
imports: [
...,
FormSmtpRoutingModule,
],
providers: [...],
})
export class FormSmtpModule {}
Encountering an error similar to what's described in this question Angular 2 - Pipe reuse in multiple modules - error not found or duplicate definition
ERROR in apps/administrator/src/app/modules/messenger/pipes/custom-message.pipe.ts:10:14 - error NG6007: The Pipe 'CustomMessagePipe' is declared by more than one NgModule.
10 export class CustomMessagePipe implements PipeTransform {
~~~~~~~~~~~~~~~~~
** Angular Live Development Server is listening on localhost:4202, open your browser on http://localhost:4202/ **
As evident, attempting both solutions leads to another problem.
How can this be resolved?