Skip to content

Commit

Permalink
docs(aio): updated i18n guide and example
Browse files Browse the repository at this point in the history
  • Loading branch information
ocombe committed Nov 1, 2017
1 parent 3a86654 commit b4a3d33
Show file tree
Hide file tree
Showing 48 changed files with 1,282 additions and 735 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -29,4 +29,3 @@ <h1 i18n="@@introductionHeader">Hello i18n!</h1>
<!--#docregion i18n-title-->
<img [src]="logo" title="Angular logo">
<!--#enddocregion i18n-title-->
Contact GitHub API Training Shop Blog About
7 changes: 7 additions & 0 deletions aio/content/examples/i18n/doc-files/app.locale_data_extra.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
// #docregion import-locale-extra
import { registerLocaleData } from '@angular/common';
import localeFrCa from '@angular/common/locales/fr-CA';
import localeFrCaExtra from '@angular/common/locales/extra/fr-CA';

registerLocaleData(localeFrCa, localeFrCaExtra);
// #enddocregion import-locale-extra
13 changes: 13 additions & 0 deletions aio/content/examples/i18n/doc-files/app.module.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
// #docregion
import { LOCALE_ID, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from '../src/app/app.component';

@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent ],
providers: [ { provide: LOCALE_ID, useValue: 'fr' } ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@
// #docregion
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);
22 changes: 22 additions & 0 deletions aio/content/examples/i18n/doc-files/main.2.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
// #docregion
import { enableProdMode, TRANSLATIONS, TRANSLATIONS_FORMAT } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
enableProdMode();
}

// use the require method provided by webpack
declare const require;
// we use the webpack raw-loader to return the content as a string
const translations = require(`raw-loader!./locale/messages.fr.xlf`);

platformBrowserDynamic().bootstrapModule(AppModule, {
providers: [
{provide: TRANSLATIONS, useValue: translations},
{provide: TRANSLATIONS_FORMAT, useValue: 'xlf'}
]
});
13 changes: 13 additions & 0 deletions aio/content/examples/i18n/doc-files/main.3.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
// #docregion
import { MissingTranslationStrategy } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';

// ...

platformBrowserDynamic().bootstrapModule(AppModule, {
missingTranslation: MissingTranslationStrategy.Error,
providers: [
// ...
]
});
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!-- The `messages.es.xlf` after translation for documentation purposes -->
<!-- The `messages.fr.xlf` after translation for documentation purposes -->
<!-- #docregion -->
<?xml version="1.0" encoding="UTF-8" ?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
Expand All @@ -9,7 +9,7 @@
<trans-unit id="introductionHeader" datatype="html">
<!-- #enddocregion custom-id -->
<source>Hello i18n!</source>
<target>¡Hola i18n!</target>
<target>Bonjour i18n !</target>
<note priority="1" from="description">An introduction header for this sample</note>
<note priority="1" from="meaning">User welcome</note>
</trans-unit>
Expand All @@ -19,58 +19,44 @@
<trans-unit id="ba0cc104d3d69bf669f97b8d96a4c5d8d9559aa3" datatype="html">
<!-- #enddocregion generated-id -->
<source>I don&apos;t output any element</source>
<target>No genero ningún elemento</target>
<target>Je n'affiche aucun élément</target>
</trans-unit>
<trans-unit id="701174153757adf13e7c24a248c8a873ac9f5193" datatype="html">
<source>Angular logo</source>
<target>Logo de Angular</target>
<target>Logo d'Angular</target>
</trans-unit>
<!-- #enddocregion translated-other-nodes -->
<!-- #docregion translated-plural -->
<trans-unit id="6e22e74e8cbd3095560cfe08993c4fdfa3c50eb0" datatype="html">
<source/>
<target>{wolves, plural, =0 {ningún lobo} =1 {un lobo} =2 {dos lobos} other {una horda de lobos}}</target>
<trans-unit id="5a134dee893586d02bffc9611056b9cadf9abfad" datatype="html">
<source>{VAR_PLURAL, plural, =0 {just now} =1 {one minute ago} other {<x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutes ago} }</source>
<target>{VAR_PLURAL, plural, =0 {à l'instant} =1 {il y a une minute} other {il y a <x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutes} }</target>
</trans-unit>
<!-- #enddocregion translated-plural -->
<!-- #docregion translated-select -->
<!-- #docregion translate-select-1 -->
<trans-unit id="61cafedb85466ab789b3ae817bba1a545468ee1c" datatype="html">
<source>The hero is <x id="ICU"/></source>
<target>El heroe es <x id="ICU"/></target>
<trans-unit id="52515023fc70c216ef291086c1962ff135a9fe13" datatype="html">
<source>The author is <x id="ICU" equiv-text="{gender, select, m {...} f {...} o {...}}"/></source>
<target>L'auteur est <x id="ICU" equiv-text="{gender, select, m {...} f {...} o {...}}"/></target>
</trans-unit>
<!-- #enddocregion translate-select-1 -->
<!-- #docregion translate-select-2 -->
<trans-unit id="14c7055d67771a3b7b6888d282ac092896be06b6" datatype="html">
<source/>
<target>{gender, select, m {hombre} f {mujer}}</target>
<trans-unit id="4e6fd3f2bb3477e8ad2088f03257f6e1b8b515a5" datatype="html">
<source>{VAR_SELECT, select, m {male} f {female} o {other} }</source>
<target>{VAR_SELECT, select, m {un homme} f {une femme} o {autre} }</target>
</trans-unit>
<!-- #enddocregion translate-select-2 -->
<!-- #enddocregion translated-select -->
<trans-unit id="db04527df562d12c8607eab2b5723ef6e2066ba0" datatype="html">
<source>Here we have: <x id="ICU"/></source>
<target/>
</trans-unit>
<trans-unit id="000058be4e6f08b685d1d0a70f9da68067df7379" datatype="html">
<source/>
<target/>
</trans-unit>
<!-- #docregion translate-nested -->
<!-- #docregion translate-nested-1 -->
<trans-unit id="2cf9a08c5b6e3612572a2a36dd46563013848382" datatype="html">
<source>Here we have: <x id="ICU"/></source>
<target>Aquí tenemos: <x id="ICU"/></target>
<trans-unit id="f7a55c9ef7c5b37147825a9041263305063e63e9" datatype="html">
<source>Updated: <x id="ICU" equiv-text="{minutes, plural, =0 {...} =1 {...} other {...}}"/></source>
<target>Mis à jour: <x id="ICU" equiv-text="{minutes, plural, =0 {...} =1 {...} other {...}}"/></target>
</trans-unit>
<!-- #enddocregion translate-nested-1 -->
<!-- #docregion translate-nested-2 -->
<trans-unit id="db1b921b55301ce3957e382090729562002da036" datatype="html">
<source/>
<target>
{count, plural,
=0 { nadie }
=1 {{gender, select, m {un hombre} f {una mujer}}}
other {{{heroes.length}} {gender, select, m {hombres} f {mujeres}}}
}
</target>
<trans-unit id="80b5ac44661751e191225c0b1e000bceeeccb52c" datatype="html">
<source>{VAR_PLURAL, plural, =0 {just now} =1 {one minute ago} other {<x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutes ago by {VAR_SELECT, select, m {male} f {female} o {other} }} }</source>
<target>{VAR_PLURAL, plural, =0 {à l'instant} =1 {il y a une minute} other {il y a <x id="INTERPOLATION" equiv-text="{{minutes}}"/> minutes par {VAR_SELECT, select, m {un homme} f {une femme} o {autre} }} }</target>
</trans-unit>
<!-- #enddocregion translate-nested-2 -->
<!-- #enddocregion translate-nested -->
Expand Down
36 changes: 0 additions & 36 deletions aio/content/examples/i18n/e2e-spec.ts

This file was deleted.

48 changes: 48 additions & 0 deletions aio/content/examples/i18n/e2e/app.e2e-spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
'use strict'; // necessary for es6 output in node

import { browser, element, by } from 'protractor';

// disable until we get cli 1.5+ and angular 5+ to be able to run this
describe('i18n E2E Tests', () => {

beforeEach(function () {
browser.get('');
});

it('should display i18n translated welcome: Bonjour !', function () {
expect(element(by.css('h1')).getText()).toEqual('Bonjour i18n !');
});

it('should display the node texts without elements', function () {
expect(element(by.css('app-root')).getText()).toContain(`Je n'affiche aucun élément`);
});

it('should display the translated title attribute', function () {
const title = element(by.css('img')).getAttribute('title');
expect(title).toBe(`Logo d'Angular`);
});

it('should display the ICU plural expression', function () {
expect(element.all(by.css('span')).get(0).getText()).toBe(`Mis à jour à l'instant`);
});

it('should display the ICU select expression', function () {
const selectIcuExp = element.all(by.css('span')).get(1);
expect(selectIcuExp.getText()).toBe(`L'auteur est une femme`);
element.all(by.css('button')).get(2).click();
expect(selectIcuExp.getText()).toBe(`L'auteur est un homme`);
});

it('should display the nested expression', function() {
const nestedExp = element.all(by.css('span')).get(2);
const incBtn = element.all(by.css('button')).get(0);
expect(nestedExp.getText()).toBe(`Mis à jour: à l'instant`);
incBtn.click();
expect(nestedExp.getText()).toBe(`Mis à jour: il y a une minute`);
incBtn.click();
incBtn.click();
element.all(by.css('button')).get(4).click();
expect(nestedExp.getText()).toBe(`Mis à jour: il y a 3 minutes par autre`);
});

});
3 changes: 3 additions & 0 deletions aio/content/examples/i18n/example-config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"projectType": "i18n"
}
43 changes: 0 additions & 43 deletions aio/content/examples/i18n/messages.xlf

This file was deleted.

19 changes: 0 additions & 19 deletions aio/content/examples/i18n/plnkr.json

This file was deleted.

18 changes: 9 additions & 9 deletions aio/content/examples/i18n/src/app/app.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,19 +17,19 @@ <h1 i18n="User welcome|An introduction header for this sample@@introductionHeade
<br>
<button (click)="inc(1)">+</button> <button (click)="inc(-1)">-</button>
<!--#docregion i18n-plural-->
<span i18n>{wolves, plural, =0 {no wolves} =1 {one wolf} =2 {two wolves} other {a wolf pack}}</span>
<span i18n>Updated {minutes, plural, =0 {just now} =1 {one minute ago} other {{{minutes}} minutes ago}}</span>
<!--#enddocregion i18n-plural-->
({{wolves}})
({{minutes}})
<br><br>
<button (click)="male()">&#9794;</button> <button (click)="female()">&#9792;</button>
<button (click)="male()">&#9794;</button> <button (click)="female()">&#9792;</button> <button (click)="other()">&#9895;</button>
<!--#docregion i18n-select-->
<span i18n>The hero is {gender, select, m {male} f {female}}</span>
<span i18n>The author is {gender, select, m {male} f {female} o {other}}</span>
<!--#enddocregion i18n-select-->
<br><br>
<!--#docregion i18n-nested-->
<span i18n>Here we have: {count, plural,
=0 {no one}
=1 {one {gender, select, male {man} female {woman}}}
other {{{heroes.length}} {gender, select, male {men} female {women}}}
}</span>
<span i18n>Updated: {minutes, plural,
=0 {just now}
=1 {one minute ago}
other {{{minutes}} minutes ago by {gender, select, m {male} f {female} o {other}}}}
</span>
<!--#enddocregion i18n-nested-->
8 changes: 4 additions & 4 deletions aio/content/examples/i18n/src/app/app.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,20 @@
import { Component } from '@angular/core';

@Component({
selector: 'my-app',
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
wolves = 0;
minutes = 0;
gender = 'f';
fly = true;
logo = 'https://angular.io/assets/images/logos/angular/angular.png';
count = 3;
heroes: string[] = ['Magneta', 'Celeritas', 'Dynama'];
inc(i: number) {
this.wolves = Math.min(5, Math.max(0, this.wolves + i));
this.minutes = Math.min(5, Math.max(0, this.minutes + i));
}
male() { this.gender = 'm'; }
female() { this.gender = 'f'; }
other() { this.gender = 'o'; }
}

7 changes: 0 additions & 7 deletions aio/content/examples/i18n/src/app/app.locale_data_extra.ts

This file was deleted.

0 comments on commit b4a3d33

Please sign in to comment.