I am using @ngx-translate for translation but unable to get results

[sdhupe19]

My code is

<button ion-button icon-left block (click)=“signInWithGoogle()”>

{{“Log in with Google” | translate}}

import { TranslateService,} from ‘@ngx-translate/core’;
constructor{// delarations here//}
this.lang = ‘en’;
this.translate.setDefaultLang(‘en’);
this.translate.use(‘en’);

switchLanguage() {
this.translate.use(this.lang);
}

and I am getting an error as
Error: Template parse errors:
The pipe ‘translate’ could not be found ("

  {{[ERROR ->]"Log in with Google" | translate}}

  </button>

[FdezRomero]

Hi @sdhupe19

This error is thrown because Angular doesn’t know where to find the translate pipe. You need to import the TranslateModule in the page’s *.module.ts file and add it in the imports array.

Best,
Rodrigo

[sdhupe19]

Hello, thanks for the response but it is already there in module.ts

[FdezRomero]

In the page module (not app.module.ts) and also in the imports array inside @NgModule?
Can you copy/paste your [page].module.ts in a code block here?

[sdhupe19]

<button ion-button icon-left block (click)=“signInWithGoogle()”>

{{‘Log in with Google’ | translate}}

import { NgModule } from ‘@angular/core’;

import { IonicPageModule } from ‘ionic-angular’;

import { LoginPage } from ‘./login’;

import {TranslateModule} from ‘@ngx-translate/core’;

@NgModule({

declarations: [

LoginPage,

],

imports: [

IonicPageModule.forChild(LoginPage),

TranslateModule

],

exports:[

LoginPage

]

})

export class LoginPageModule {}

//login.ts

this.lang = ‘en’;

this.translate.setDefaultLang(‘en’);

this.translate.use(‘en’);

afAuth.authState.subscribe(user => {

this.user = user;

});

}

switchLanguage() {

let alertOptions: AlertOptions = {

title: ‘Language’,

inputs: [ {

type: ‘radio’,

label: ‘English’,

value: ‘en’,

checked: this.lang == ‘en’

}, {

type: ‘radio’,

label: ‘Hindi (हिंदी)’,

value: ‘hin’,

checked: this.lang == ‘hin’

} ],

buttons: [ {

text: ‘Cancel’

}, {

text: ‘OK’,

handler: selectedLanguage => {

this.lang = selectedLanguage;

this.translate.use(this.lang);

}

} ]

}

[FdezRomero]

@sdhupe19

imports: [
IonicPageModule.forChild(LoginPage),
TranslateModule
],

You need to use TranslateModule.forChild() in the imports array at [page].module.ts, as explained in the lazy-loaded modules section of the ngx-translate documentation, instead of just TranslateModule.

P.S. Please use the “code block” button in the editor when you paste code, it’s really hard to read when pasted like normal text.

Best,
Rodrigo

[sdhupe19]

but from when CustomLoader,CustomCompiler(as mentioned in your reference link) will come? I am not getting it

[sdhupe19]

but from where CustomLoader,CustomCompiler(as mentioned in your reference link) will come? I am not getting it

[FdezRomero]

I don’t understand your question. You just have to add .forChild() after the TranslateModule you have in your imports, in the page’s module file.

[sdhupe19]

okay, I will try that.one more question is I switched from Ubuntu to ios because I want to build my app on ios but ionic build giving me errors…can you help me with this?
onic-app-script task: “build”

[19:24:27] Error: ./node_modules/stream-browserify/index.js Module not found: Error: Can’t resolve

‘readable-stream/duplex.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ resolve

‘readable-stream/duplex.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ Parsed request is a

module using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative

path: .) Field ‘browser’ doesn’t contain a valid alias configuration after using description file:

/Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .) resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules using description file: /Users/faiz/ce-web

3/package.json (relative path: ./node_modules) Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules) using

description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path:

./duplex.js) no extension /Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js doesn’t exist .ts

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.ts doesn’t exist .js /Users/faiz/ce-web

3/node_modules/readable-stream/duplex.js.js doesn’t exist .json /Users/faiz/ce-web

3/node_modules/readable-stream/duplex.js.json doesn’t exist as directory /Users/faiz/ce-web

3/node_modules/readable-stream/duplex.js doesn’t exist [/Users/faiz/ce-web

3/node_modules/readable-stream/duplex.js] [/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.ts]

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/duplex.js.json] [/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js]

@ ./node_modules/stream-browserify/index.js 30:16-52 @ ./node_modules/browserify-sign/browser/index.js @

./node_modules/crypto-browserify/index.js @ ./node_modules/bcryptjs/dist/bcrypt.js @

./src/pages/user/login/login.ts @ ./src/pages/user/login/login.module.ts @ ./src/app/app.module.ts @

./src/app/main.ts,./node_modules/stream-browserify/index.js Module not found: Error: Can’t resolve

‘readable-stream/passthrough.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ resolve

‘readable-stream/passthrough.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ Parsed request is

a module using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative

path: .) Field ‘browser’ doesn’t contain a valid alias configuration after using description file:

/Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .) resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules using description file: /Users/faiz/ce-web

3/package.json (relative path: ./node_modules) Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules) using

description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path:

./passthrough.js) no extension /Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js doesn’t

exist .ts /Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.ts doesn’t exist .js

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.js doesn’t exist .json /Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js.json doesn’t exist as directory /Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js doesn’t exist [/Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js.ts] [/Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js.json] [/Users/faiz/ce-web

3/node_modules/readable-stream/passthrough.js] @ ./node_modules/stream-browserify/index.js 32:21-62 @

./node_modules/browserify-sign/browser/index.js @ ./node_modules/crypto-browserify/index.js @

./node_modules/bcryptjs/dist/bcrypt.js @ ./src/pages/user/login/login.ts @

./src/pages/user/login/login.module.ts @ ./src/app/app.module.ts @

./src/app/main.ts,./node_modules/stream-browserify/index.js Module not found: Error: Can’t resolve

‘readable-stream/transform.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ resolve

‘readable-stream/transform.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ Parsed request is a

module using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative

path: .) Field ‘browser’ doesn’t contain a valid alias configuration after using description file:

/Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .) resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules using description file: /Users/faiz/ce-web

3/package.json (relative path: ./node_modules) Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules) using

description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path:

./transform.js) no extension /Users/faiz/ce-web 3/node_modules/readable-stream/transform.js doesn’t exist

.ts /Users/faiz/ce-web 3/node_modules/readable-stream/transform.js.ts doesn’t exist .js /Users/faiz/ce-web

3/node_modules/readable-stream/transform.js.js doesn’t exist .json /Users/faiz/ce-web

3/node_modules/readable-stream/transform.js.json doesn’t exist as directory /Users/faiz/ce-web

3/node_modules/readable-stream/transform.js doesn’t exist [/Users/faiz/ce-web

3/node_modules/readable-stream/transform.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/transform.js.ts] [/Users/faiz/ce-web

3/node_modules/readable-stream/transform.js.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/transform.js.json] [/Users/faiz/ce-web

3/node_modules/readable-stream/transform.js] @ ./node_modules/stream-browserify/index.js 31:19-58 @

./node_modules/browserify-sign/browser/index.js @ ./node_modules/crypto-browserify/index.js @

./node_modules/bcryptjs/dist/bcrypt.js @ ./src/pages/user/login/login.ts @

./src/pages/user/login/login.module.ts @ ./src/app/app.module.ts @

./src/app/main.ts,./node_modules/stream-browserify/index.js Module not found: Error: Can’t resolve

‘readable-stream/writable.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ resolve

‘readable-stream/writable.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’ Parsed request is a

module using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative

path: .) Field ‘browser’ doesn’t contain a valid alias configuration after using description file:

/Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .) resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules using description file: /Users/faiz/ce-web

3/package.json (relative path: ./node_modules) Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules) using

description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path:

./writable.js) no extension /Users/faiz/ce-web 3/node_modules/readable-stream/writable.js doesn’t exist .ts

/Users/faiz/ce-web 3/node_modules/readable-stream/writable.js.ts doesn’t exist .js /Users/faiz/ce-web

3/node_modules/readable-stream/writable.js.js doesn’t exist .json /Users/faiz/ce-web

3/node_modules/readable-stream/writable.js.json doesn’t exist as directory /Users/faiz/ce-web

3/node_modules/readable-stream/writable.js doesn’t exist [/Users/faiz/ce-web

3/node_modules/readable-stream/writable.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/writable.js.ts] [/Users/faiz/ce-web

3/node_modules/readable-stream/writable.js.js] [/Users/faiz/ce-web

3/node_modules/readable-stream/writable.js.json] [/Users/faiz/ce-web

3/node_modules/readable-stream/writable.js] @ ./node_modules/stream-browserify/index.js 29:18-56 @

./node_modules/browserify-sign/browser/index.js @ ./node_modules/crypto-browserify/index.js @

./node_modules/bcryptjs/dist/bcrypt.js @ ./src/pages/user/login/login.ts @

./src/pages/user/login/login.module.ts @ ./src/app/app.module.ts @ ./src/app/main.ts

Error: ./node_modules/stream-browserify/index.js

Module not found: Error: Can’t resolve ‘readable-stream/duplex.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’

resolve ‘readable-stream/duplex.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’

Parsed request is a module

using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .)

Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .)

resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules

using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules)

Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules)

using description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path: ./duplex.js)

no extension

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js doesn’t exist

.ts

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.ts doesn’t exist

.js

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.js doesn’t exist

.json

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.json doesn’t exist

as directory

/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js doesn’t exist

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js]

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.ts]

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.js]

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js.json]

[/Users/faiz/ce-web 3/node_modules/readable-stream/duplex.js]

@ ./node_modules/stream-browserify/index.js 30:16-52

@ ./node_modules/browserify-sign/browser/index.js

@ ./node_modules/crypto-browserify/index.js

@ ./node_modules/bcryptjs/dist/bcrypt.js

@ ./src/pages/user/login/login.ts

@ ./src/pages/user/login/login.module.ts

@ ./src/app/app.module.ts

@ ./src/app/main.ts,./node_modules/stream-browserify/index.js

Module not found: Error: Can’t resolve ‘readable-stream/passthrough.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’

resolve ‘readable-stream/passthrough.js’ in ‘/Users/faiz/ce-web 3/node_modules/stream-browserify’

Parsed request is a module

using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .)

Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/node_modules/stream-browserify/package.json (relative path: .)

resolve as module

looking for modules in /Users/faiz/ce-web 3/node_modules

using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules)

Field ‘browser’ doesn’t contain a valid alias configuration

after using description file: /Users/faiz/ce-web 3/package.json (relative path: ./node_modules)

using description file: /Users/faiz/ce-web 3/node_modules/readable-stream/package.json (relative path: ./passthrough.js)

no extension

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js doesn’t exist

.ts

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.ts doesn’t exist

.js

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.js doesn’t exist

.json

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.json doesn’t exist

as directory

/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js doesn’t exist

[/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js]

[/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.ts]

[/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.js]

[/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js.json]

[/Users/faiz/ce-web 3/node_modules/readable-stream/passthrough.js]

[FdezRomero]

Did you also copy node_modules to the new machine? If you did, delete the folder and run npm install again.

[sdhupe19]

i am using ionic2 super-tabs but i am getting an error as Property ‘parent’ in type ‘SuperTabsComponent’ is not assignable to the same property in base type ‘NavigationContainer’.
Type ‘NavControllerBase’ is not assignable to type ‘NavController’

[sdhupe19]

can you help me with ng-translate?

[Crashupride]

You saved my day, thank you very much.