CODEWITHSUNDEEP
angularpipeangular-pipe
Taladan
Taladan

Reputation: 479

Custom Pipe could not be found

I have built a pipe, but I can't tell why angular can't find it.

My top module is my shared.module

This module is in turn integrated by browser.module or server.module.

Furthermore, I have a user.module as the lowest level, where all the user's components come in.

if I define my pipe in user.module, the pipe will be found. 

import { ExponentialStrengthPipe } from '../../exponential-strength.pipe';
[...]

@NgModule({
    declarations: [ [...]

        ExponentialStrengthPipe
    ],
    imports: [
        CommonModule,
        HttpModule,
        FormsModule,
        ReactiveFormsModule,
        RouterModule.forChild([...])
    ],

})
export class UserModule {
    constructor(
    ) {
    }

}

if I install it in my shared. module, no more.

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ExponentialStrengthPipe } from './exponential-strength.pipe';
[...]
@NgModule({
    declarations: [
        AppComponent,
[...]
        ExponentialStrengthPipe
    ],

    providers: [
        UserService

    ],
    imports: [
        CommonModule,
        RouterModule.forRoot([
            { path: 'home', component: HomeComponent },
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: '**', component: PageNotFoundComponent },
        ]),
    ],
    exports: [
        ExponentialStrengthPipe
        ]

})
export class AppModuleShared {
    constructor(
    ) {
    }

}

Upvotes: 1

Views: 878

Answers (2)

richa mathur
richa mathur

Reputation: 11

You must include your pipe in the declarations array of the AppModule If you choose to inject your pipe into a class, you must provide it in the providers array of your NgModule.

Upvotes: 0

Ishara Sandun
Ishara Sandun

Reputation: 737

If you want to use the pipe in a different module, then add the module where the pipe is declared to imports: [...] of the module where you want to re-use the pipe, instead of adding it to declarations: [] of the module. If you add the pipe in multiple declarations:[] you will get an error complaining that you have declared the pipe in multiple modules. So In this case you have to add the pipe in declarations: [] of the shared module and add the shared module to the imports: [...] in the module you want to use the pipe. (Ex: user module)

Upvotes: 1

Related Questions