The code below does not seem to work when I attempt to use the pipe on a page within my app. I am not sure if the App decorator works in this manner or if I am missing something. The idea is to not have to inject CustomPipe into every page that needs it as most pages will use it.
Injencting in each page does work, if that pipe should be imported in a lot of the files in the app it makes sense to make it available through the whole app.
As some config options carry away through the app as the providers, then it’s logic to think that you can do the same with pipes but i think of pipes more like directives, they have to be injected in the component where they will be used, so injecting a pipe as global instance in the app’s config probably won’t work.
If you ask why, i think providers are the exception, they carry data between components so it makes sense to be able to inject it as a global singleton instance, but pipes and directives changes the html structure, so in order to lower the overhead of looking up for the selector through all the app you have to inject it in each specific component that uses it, at least that’s what i think Angular 2 is doing with the configs, correct me if i’m wrong.
Interesting, didn’t know about this in the Angular docs, idk, give me time to dig the app code and see if that property of the bootstrap function is exposed to the @app annotation constructor.
For future reference to all, the way to provide global services is up there as i stated and @eillarra corrected
For global components or directives use the following (Seems weird but it works, take note that i have to provide it to the providers array, and use the PLATFORM_DIRECTIVES instead of PLATFORM_PIPES or any other platform related variable):
import {provide, PLATFORM_DIRECTIVES} from 'angular2/core';
import {NewComponent} from './components/components';
@App({
templateUrl: 'build/app.html',
providers: [
provide(PLATFORM_DIRECTIVES, {useValue: [NewComponent], multi: true})
],
WTF is that? why so much provide? the useValue property is an array, just put all those inside the array, that way you’ll save some overhead in calling the provide function.
Well if you typed userValue instead of useValue i’m not surprised, did you try again and worked?
Just make sure you typed the right property name, and that all those are directives, if they are services or providers they go outside of the provide in the ionicBootstrap providers array.