Ionic 2 : integrate ng2-translate : Property '_backend' is protected but type 'Http' is not a class derived from 'Http'


#1

Hi, I wanted to try the translate service, but could not make it work.
I install it with ‘npm install ng2-translate’.

My @app:

import {App, IonicApp, Platform, MenuController} from 'ionic-angular';
import {provide} from 'angular2/core';
import {Http} from 'angular2/http';
import {StatusBar} from 'ionic-native';
import {TranslateService, TranslatePipe, TranslateLoader, TranslateStaticLoader} from 'ng2-translate/ng2-translate';
@App({
    templateUrl: 'build/app.html',
    providers: [ 
    provide(TranslateLoader, {
      useFactory: (http: Http) => new TranslateStaticLoader(http, 'assets', '.json'),
      deps: [Http]
    }),
    TranslateService
  ],
    config: {} // http://ionicframework.com/docs/v2/api/config/Config/
})

I have this problem on http before ‘assets’ :
Error TS2345: Argument of type ‘Http’ is not assignable to parameter of type ‘Http’.
Property ‘_backend’ is protected but type ‘Http’ is not a class derived from ‘Http’.

If i remove ‘: Http’, it compiles:
useFactory: (http) => new TranslateStaticLoader(http, 'assets', '.json'),

But in runtime :
browser_adapter.ts:73 EXCEPTION: No provider for Http! (MyApp -> TranslateService -> Http)

Package.json :

 "dependencies": {
    "angular2": "2.0.0-beta.15",
    "es6-shim": "^0.35.0",
    "ionic-angular": "2.0.0-beta.6",
    "ionic-native": "^1.1.0",
    "ionicons": "3.0.0-alpha.3",
    "rxjs": "5.0.0-beta.2"
  }

Any ideas?
Thanks


#2

Take a look here: https://github.com/mgechev/angular2-seed/issues/640


#3

Yes, it’s the same problem, but this solution is for angular 2 app.
For ionic 2, i don’t find project.config.ts, or contents of main.ts is different.


#4

And ng2-translate dependency?

add “ng2-translate”: “^1.11.1” to your dependencies array and run npm install


#5

Mmm okay, in fact, it’s a problem of versions.
This post described it : https://github.com/ocombe/ng2-translate/issues/105

I downgrade ng2-translate to “^1.11.1”, and it’s works (because the version of angular2 is <16).