Comments (4)
I find it incredibly hard to use it in Angular 17 without the module structure.
{
path: `${environment.seo.service}`,
loadComponent: () =>
import('../pages/seo/seo.component').then((c) => c.SeoComponent),
providers: [
importProvidersFrom([
TranslateModule.forChild({
loader: {
provide: TranslateLoader,
useFactory: () => {
return new TranslateJsonLoader();
},
},
}),
]),
],
},
Is this corrrect understood this is the new way we should implement pr lazyloading basis of a component?.
I keep getting the following error:
ERROR Error [NullInjectorError]: R3InjectorError(Standalone[_SeoComponent])[_TranslatePipe -> _TranslatePipe -> _TranslatePipe -> _TranslatePipe]:
NullInjectorError: No provider for _TranslatePipe!
at NullInjector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:5605:27)
at R3Injector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:6048:33)
at R3Injector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:6048:33)
at R3Injector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:6048:33)
at R3Injector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:6048:33)
at ChainedInjector.get (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:15426:36)
at lookupTokenUsingModuleInjector (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:4116:39)
at getOrCreateInjectable (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:4164:12)
at Module.ɵɵdirectiveInject (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/node_modules/@angular/core/fesm2022/core.mjs:11987:19)
at NodeInjectorFactory.SeoComponent_Factory (/Users/patricksahlgren/Desktop/Handyhand/handyhand-seo/src/app/pages/seo/seo.component.ts:127:24) {
ngTempTokenPath: null,
ngTokenPath: [
'_TranslatePipe',
'_TranslatePipe',
'_TranslatePipe',
'_TranslatePipe'
]
}
TranslateJsonLoader:
import { TranslateLoader } from '@ngx-translate/core';
import { of } from 'rxjs';
import * as dk from 'assets/i18n/dk.json';
import * as en from 'assets/i18n/en.json';
import { environment } from '../environments/environment.dk';
export class TranslateJsonLoader implements TranslateLoader {
constructor() {}
public getTranslation() {
switch (environment.language) {
case 'dk':
{
return of(dk);
}
break;
case 'en':
{
return of(en);
}
break;
default:
{
return of(dk);
}
break;
}
}
}
Please help, @johnsonlin , @mtabaj :)
Running Angular v. 17. latest version of ngx-translate.
from core.
You can put it in your app routes like so:
export const routes: Routes = [
...
{
path: 'example',
loadComponent: () => import(...).then(mod => mod.ExampleComponent),
providers: [
importProvidersFrom([
TranslateModule.forChild(...)
])
]
}
...
]
from core.
I'm wondering if for small projects it makes sense to just stick with modules for now.
from core.
Related Issues (20)
- bump angular 17 HOT 3
- Translation keys are ignored when dot format and nested format are mixed
- How to handle import TranslateModule.forChild in module when creating a standalone component in an NgModule Application HOT 10
- How to use ngx-translate in Angular 17, Knowing that AppModule is not implemented? HOT 3
- Support for Angular v17 HOT 29
- ngx-translate creates billions of tiny files HOT 1
- 'EventEmitter' and 'DefaultLangChangeEvent' is declared but its value is never read.
- Angular 17 SSR. Standalone implementation - NullInjectorError: No provider for _TranslatePipe! HOT 1
- I am trying to add Arabic language. I have configured package correctly but some labels are translated some are not
- Latency when loading the website, because Translation Key appears when user opens our website HOT 1
- Add opption to pass callback in translate pipe
- ncaught SyntaxError: Cannot use import statement outside a module (at scripts.js:16887:1) main.ts:13 Error: Unexpected value 'TranslateModule' imported by the module 'AppModule'. Please add an @NgModule annotation. at verifySemanticsOfNgModuleDef (core.mjs:28868:5) at core.mjs:28878:5 at Array.forEach (<anonymous>) at verifySemanticsOfNgModuleDef (core.mjs:28876:43) at AppModule.get (core.mjs:28833:23) at getInjectorDef (core.mjs:333:1) at walkProviderTree (core.mjs:5550:1) at core.mjs:5500:6 at core.mjs:4701:1 at Array.forEach (<anonymous>)
- Wrong TranslateHttpLoader after upgrade app to Angular 17
- ngx-translate not working with interceptor in Ionic Capacitor app
- Error: [$injector:unpr] Unknown provider: translateProvider <- translate
- Configuration: defaultLanguage in TranslateModule.forRoot as a Provider HOT 1
- ngx-translate.com is pointing another website HOT 3
- Ngx-translate: ..assets/i18n/ja.json: 404 Not Found after deployment HOT 1
- TranslateService.use with multiple calls causes to display the wrong language
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from core.