diff --git a/package-lock.json b/package-lock.json index 06834cb..998bc60 100644 --- a/package-lock.json +++ b/package-lock.json @@ -901,6 +901,22 @@ } } }, + "@ngx-translate/core": { + "version": "11.0.1", + "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-11.0.1.tgz", + "integrity": "sha512-nBCa1ZD9fAUY/3eskP3Lql2fNg8OMrYIej1/5GRsfcutx9tG/5fZLCv9m6UCw1aS+u4uK/vXjv1ctG/FdMvaWg==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@ngx-translate/http-loader": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-4.0.0.tgz", + "integrity": "sha512-x8LumqydWD7eX9yQTAVeoCM9gFUIGVTUjZqbxdAUavAA3qVnk9wCQux7iHLPXpydl8vyQmLoPQR+fFU+DUDOMA==", + "requires": { + "tslib": "^1.9.0" + } + }, "@schematics/angular": { "version": "7.1.4", "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-7.1.4.tgz", @@ -4676,13 +4692,11 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true, - "optional": true + "bundled": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -4699,8 +4713,7 @@ }, "concat-map": { "version": "0.0.1", - "bundled": true, - "optional": true + "bundled": true }, "console-control-strings": { "version": "1.1.0", @@ -4829,7 +4842,6 @@ "minimatch": { "version": "3.0.4", "bundled": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } diff --git a/package.json b/package.json index 339b596..8f00eaa 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,8 @@ "@angular/platform-browser": "~7.1.0", "@angular/platform-browser-dynamic": "~7.1.0", "@angular/router": "~7.1.0", + "@ngx-translate/core": "^11.0.1", + "@ngx-translate/http-loader": "^4.0.0", "angular-font-awesome": "^3.1.2", "bootstrap": "^4.3.1", "core-js": "^2.5.4", diff --git a/src/app/app.component.html b/src/app/app.component.html index d58495d..9ae94dd 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -18,8 +18,8 @@ - - Log In + + App.Login
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 37050b0..cb85dc3 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { MenuItem } from 'primeng/api'; import { AppService } from './app.service'; +import { TranslateService } from '@ngx-translate/core'; @Component({ @@ -25,16 +26,20 @@ export class AppComponent implements OnInit{ public birthday: Date; constructor( - private _appService: AppService + private _appService: AppService, + private _translateService: TranslateService ){} + ngOnInit(){ this.items = [ {label: 'Update', icon: 'pi pi-refresh'}, {label: 'Delete', icon: 'pi pi-times'} ]; + // To Include in a fonction of a dropdown language chose + this._translateService.setDefaultLang('fr'); } - + public LogIn() { this._appService.GetToken(this.Username, this.Password) diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 909332a..a807a82 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,7 +5,7 @@ import { NgModule, Provider, APP_INITIALIZER } from '@angular/core'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { HomePageComponent } from './home-page/home-page.component'; -import { HttpClientModule } from '@angular/common/http'; +import { HttpClientModule, HttpClient } from '@angular/common/http'; import { AlertModule } from 'ngx-bootstrap/alert'; import { BsDatepickerModule } from 'ngx-bootstrap/datepicker'; @@ -22,6 +22,9 @@ import { AppService } from './app.service'; import { FormsModule } from '@angular/forms'; import { CalendarModule } from 'primeng/calendar'; +import {TranslateModule, TranslateLoader} from '@ngx-translate/core'; +import {TranslateHttpLoader} from '@ngx-translate/http-loader'; + @@ -38,6 +41,10 @@ export const INIT_API_CONFIGURATION: Provider = { multi:true }; +// AoT requires an exported function for factories +export function HttpLoaderFactory(http: HttpClient) { + return new TranslateHttpLoader(http); +} @NgModule({ @@ -61,7 +68,14 @@ export const INIT_API_CONFIGURATION: Provider = { InputTextModule, HttpClientModule, FormsModule, - CalendarModule + CalendarModule, + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: HttpLoaderFactory, + deps: [HttpClient] + } + }) ], providers: [ INIT_API_CONFIGURATION, diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json new file mode 100644 index 0000000..d41db0e --- /dev/null +++ b/src/assets/i18n/en.json @@ -0,0 +1,5 @@ +{ + "App":{ + "Login":"LOGIN" + } +} diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json new file mode 100644 index 0000000..0990002 --- /dev/null +++ b/src/assets/i18n/fr.json @@ -0,0 +1,5 @@ +{ + "App":{ + "Login":"Se Connecter" + } +}