icu

ngx-translate-demo-standalone-icu/public/i18n/de.json

@@ -1,16 +1,6 @@
 {
-	"demo": {
-		"greeting": "Hallo {name}!",
-		"text": "Dies ist eine einfache Applikation um die Funktionen von ngx-transalte zu demonstrieren.",
-		"title": "Übersetzungs-Demo"
-	},
 	"icu": {
 		"pluralization": "Da {count, plural, =0{ist kein Apfel} one{ist ein Apfel} other{sind mehrere Äpfel}}.",
 		"select": "{gender, select, male{Er verwendet} female{Sie verwendet} other{Sie verwenden }} {product}."
-	},
-	"messagebox": {
-		"warning": {
-			"text": "Warnung!"
-		}
 	}
 }

ngx-translate-demo-standalone-icu/public/i18n/en.json

@@ -1,16 +1,6 @@
 {
-	"demo": {
-		"greeting": "Hello {name}!",
-		"text": "This is a simple demonstration app for ngx-translate",
-		"title": "Translation demo"
-	},
 	"icu": {
 		"pluralization": "There {count, plural, =0{is no apple} one{is one apple} other{there are several apples}}.",
 		"select": "{gender, select, male{He uses} female{She uses} other{They use }} {product}"
-	},
-	"messagebox": {
-		"warning": {
-			"text": "Warning!"
-		}
 	}
 }

ngx-translate-demo-standalone-icu/src/app/app.component.html

@@ -16,7 +16,7 @@ <h3>Pluralization</h3>
         <option value="5">5</option>
     </select>
 
-    <p id="icuPluralization" translate="" [translateParams]="{count}">icu.pluralization</p>
+    <p id="icuPluralization" translate [translateParams]="{count}">icu.pluralization</p>
     <p>{{'icu.pluralization' | translate:{ count } }}</p>
 
     <h3>Selection</h3>

ngx-translate-demo-standalone-icu/src/app/app.component.i18n.spec.ts

@@ -0,0 +1,74 @@
+import { TestBed } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import {} from 'jasmine';
+import {TranslateCompiler, TranslateLoader, TranslateModule, TranslateService} from "@ngx-translate/core";
+import {StaticTranslationLoader} from "./static-translations-loader";
+import {TranslateMessageFormatCompiler} from "ngx-translate-messageformat-compiler";
+
+
+describe('AppComponent Localized', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        AppComponent,
+        TranslateModule.forRoot({
+          loader: {
+            provide: TranslateLoader,
+            useClass: StaticTranslationLoader,
+          },
+          compiler: {
+            provide: TranslateCompiler,
+            useClass: TranslateMessageFormatCompiler
+          }
+        })],
+      providers: []
+    }).compileComponents();
+
+    const translateService = TestBed.inject(TranslateService);
+    translateService.addLangs(["de", "en"]);
+    translateService.setDefaultLang('en');
+  });
+
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+
+  it('should render pluralization for 0 in english (default)', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('There is no apple.');
+  });
+
+
+  it('should render pluralization for 0 in german', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+
+    const translateService = TestBed.inject(TranslateService);
+    translateService.use('de');
+
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('Da ist kein Apfel.');
+  });
+
+
+  it('should render pluralization for 1 in English (default) after selecting from combo box', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+
+    const compiled = fixture.nativeElement as HTMLElement;
+
+    const selectElement = compiled.querySelector('#count-select') as HTMLSelectElement;
+    selectElement.value = '1';
+    selectElement.dispatchEvent(new Event('change'));
+    fixture.detectChanges();
+
+    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('There is one apple.');
+  });
+});

ngx-translate-demo-standalone-icu/src/app/app.component.scss

@@ -12,7 +12,7 @@ p, .translated
 }
 
 button {
-  background-color: #008CBA; // Initial background color
+  background-color: #008CBA;
   border: none;
   color: white;
   padding: 0.25rem 0.5rem;
@@ -21,19 +21,18 @@ button {
   display: inline-block;
   font-size: 16px;
   margin-left: 1rem;
-  border-radius: 0.5rem; // Rounded corners
-  transition: background-color 0.3s ease; // Smooth transition on hover
+  border-radius: 0.5rem;
+  transition: background-color 0.3s ease;
 
   &:hover {
-    background-color: #005f73; // Background color on hover
+    background-color: #005f73;
   }
 }
 
-
 .title {
   background-color: #bde8f8;
   padding: 0.5rem 2rem 1.5rem 2rem;
   position: sticky;
-  top: 0; /* Sticks the element to the top of the container/viewport */
-  z-index: 1000; /* Optional: ensures the title stays above other content */
+  top: 0;
+  z-index: 1000;
 }

ngx-translate-demo-standalone-icu/src/app/app.component.spec.ts

@@ -1,74 +1,23 @@
 import { TestBed } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 import {} from 'jasmine';
-import {TranslateCompiler, TranslateLoader, TranslateModule, TranslateService} from "@ngx-translate/core";
-import {StaticTranslationLoader} from "./static-translations-loader";
-import {TranslateMessageFormatCompiler} from "ngx-translate-messageformat-compiler";
+import {TranslateModule} from "@ngx-translate/core";
 
 
-describe('AppComponent Localized', () => {
+describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [
         AppComponent,
-        TranslateModule.forRoot({
-          loader: {
-            provide: TranslateLoader,
-            useClass: StaticTranslationLoader,
-          },
-          compiler: {
-            provide: TranslateCompiler,
-            useClass: TranslateMessageFormatCompiler
-          }
-      })],
-      providers: []
+        TranslateModule.forRoot({})
+      ],
     }).compileComponents();
-
-    const translateService = TestBed.inject(TranslateService);
-    translateService.addLangs(["de", "en"]);
-    translateService.setDefaultLang('en');
   });
 
-
   it('should create the app', () => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.componentInstance;
     expect(app).toBeTruthy();
   });
 
-
-  it('should render pluralization for 0 in english (default)', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('There is no apple.');
-  });
-
-
-  it('should render pluralization for 0 in german', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-
-    const translateService = TestBed.inject(TranslateService);
-    translateService.use('de');
-
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('Da ist kein Apfel.');
-  });
-
-
-  it('should render pluralization for 1 in English (default) after selecting from combo box', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-
-    const compiled = fixture.nativeElement as HTMLElement;
-
-    const selectElement = compiled.querySelector('#count-select') as HTMLSelectElement;
-    selectElement.value = '1';
-    selectElement.dispatchEvent(new Event('change'));
-    fixture.detectChanges();
-
-    expect(compiled.querySelector('#icuPluralization')?.textContent).toContain('There is one apple.');
-  });
 });

ngx-translate-demo-standalone-icu/src/app/app.config.ts

@@ -1,15 +1,15 @@
 import {ApplicationConfig, importProvidersFrom, provideZoneChangeDetection} from "@angular/core";
 import {provideHttpClient} from "@angular/common/http";
 import {TranslateModule, TranslateLoader, TranslateCompiler} from "@ngx-translate/core";
-import { TranslateHttpLoader } from '@ngx-translate/http-loader';
-import { HttpClient } from '@angular/common/http';
-import {TranslateMessageFormatCompiler} from "ngx-translate-messageformat-compiler";
+import {TranslateHttpLoader} from '@ngx-translate/http-loader';
+import {HttpClient} from '@angular/common/http';
+
+import {TranslateMessageFormatCompiler} from 'ngx-translate-messageformat-compiler';
 
 
 const httpLoaderFactory: (http: HttpClient) => TranslateHttpLoader = (http: HttpClient) =>
     new TranslateHttpLoader(http, './i18n/', '.json');
 
-
 export const appConfig: ApplicationConfig = {
   providers: [
     provideZoneChangeDetection({ eventCoalescing: true }),