No exported member 'ionicBootstrap'


#1

Trying to import the ionicBootstrap to get ng2-translator working and following the docs here: https://ionicframework.com/docs/v2/resources/ng2-translate/. However whenever I tried to import ionicBootstrap it does not recognize the module, saying ‘module has not exported member ionicBootstrap’.
I am importing it like this into my app.ts component.

import {ionicBootstrap} from 'ionic-angular'; // Throws error

I am on the current version of ionic 2:

"ionic-angular": "^2.0.0-rc.0"

I also tried porting and creating new ionic 2 projects and could not get ionicBootstrap imported. Has anyone else had this problem? Thanks in advance.


#2

You do not need ionicBootstrap anymore since rc0, you just have to put

 { 
    provide: TranslateLoader,
    useFactory: (http: Http) => new TranslateStaticLoader(http, 'assets/i18n', '.json'),
    deps: [Http]
  },
  TranslateService

in app.module.ts :

imports: [
    IonicModule.forRoot(MyApp, ...)
    ...
]

The doc need to be updated.


#3

Thanks for the reply. Do you mean like this?

imports: [
        IonicModule.forRoot(AppComponent),
        HttpModule,
        {
            provide: TranslateLoader,
            useFactory: (http: Http) => new TranslateStaticLoader(http, 'assets/i18n', '.json'),
            deps: [Http]
        },
        TranslateService
    ],

My NgModule complains about format when I do it that way, or does it need to be in the IonicModule.forRoot(MyApp, import here)? If I do it the latter way, I get an error saying no Provider for TranslateLoader.


#4

There is a specific part about using ionic2 there : ng2-translate#usage


#5

Where do I place settings like backButtonText as edscribed in the docs?


#6

In IonicModule.forRoot(MyApp, …) like this :
IonicModule.forRoot(MyApp, {backButtonText: '...'}) or later in code like this : http://stackoverflow.com/questions/36861499/translate-back-button-ionic-2


#7

But to be clear, adding a provider and using ionicBootstrap are two different things, correct? If I use a provider, it is for that component, hence, instantiated each time that component is instantiated. If It uses ionicBootstrap, the service doesn’t reload per component loaded, it persists through the entire application.


“Which of these two you choose can matter a great deal. If you add it to the bootstrap then a single instance of the service will be created that all components in the application will share – making it a great way to share data between components. If you add the provider to an individual component, then a new instance will be created for just that one component.”


#8

but, the linked article uses ionicBootStrap which isn’t there anymore…

its unclear what to do. I want my data provider to be single instance across all components…


#9

nevermind, i got it working ok


#10

How did you get it working? I’m stuck with the same problem


#11

been a while… looking thru my code, it seems i made the provider injectable

@Injectable()
export class DataProvider {

and then injected it into my app.component.

import { DataProvider } from '../providers/data/data';
.
.
.
constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,private **data:DataProvider**) {

and the pages I need to access it on


#12

Thank you very much for the reply :relieved: , I’ll check it out.