From 8a911773b87f084e2c1ca2e5c0ddf81079017e41 Mon Sep 17 00:00:00 2001 From: Judy Bogart Date: Mon, 9 Sep 2019 12:53:37 -0700 Subject: [PATCH] docs: add header to code examples (#32563) PR Close #32563 --- aio/content/guide/i18n.md | 13 +++++++------ aio/content/guide/universal.md | 8 ++++---- aio/content/guide/web-worker.md | 8 ++++---- 3 files changed, 15 insertions(+), 14 deletions(-) diff --git a/aio/content/guide/i18n.md b/aio/content/guide/i18n.md index 4115255cb5..ac99d4d8fd 100644 --- a/aio/content/guide/i18n.md +++ b/aio/content/guide/i18n.md @@ -193,7 +193,7 @@ text messages with different descriptions (not different meanings), then they ar The angular i18n extractor tool generates a file with a translation unit entry for each `i18n` attribute in a template. By default, it assigns each translation unit a unique id such as this one: - + When you change the translatable text, the extractor tool generates a new id for that translation unit. You must then update the translation file with the new id. @@ -206,7 +206,7 @@ The example below defines the custom id `introductionHeader`: When you specify a custom id, the extractor tool and compiler generate a translation unit with that custom id. - + The custom id is persistent. The extractor tool does not change it when the translatable text changes. Therefore, you do not need to update the translation. This approach makes maintenance easier. @@ -645,9 +645,9 @@ ready-to-run application package, typically for production. When you internationalize with the AOT compiler, you must pre-build a separate application package for each language and serve the appropriate package based on either server-side language -detection or url parameters. +detection or URL parameters. -To instruct the AOT compiler to use your translation configuration, set the three "i18n" build configuration options in your `angular.json` file. +To instruct the AOT compiler to use your translation configuration, set the three "i18n" build configuration options in your CLI configuration file, `angular.json`. * `i18nFile`: the path to the translation file. * `i18nFormat`: the format of the translation file. @@ -763,6 +763,7 @@ Then provide the `LOCALE_ID` in the main module: {@a missing-translation} ### Report missing translations + By default, when a translation is missing, the build succeeds but generates a warning such as `Missing translation for message "foo"`. You can configure the level of warning that is generated by the Angular compiler: @@ -772,7 +773,7 @@ compilation, the app will fail to load. * Warning (default): show a 'Missing translation' warning in the console or shell. * Ignore: do nothing. -You specify the warning level in the `configurations` section your Angular CLI build configuration. The example below shows how to set the warning level to error: +You specify the warning level in the `configurations` section of your Angular CLI configuration file, `angular.json`. The example below shows how to set the warning level to error. ``` "configurations": { @@ -786,7 +787,7 @@ You specify the warning level in the `configurations` section your Angular CLI b If you use the JIT compiler, specify the warning level in the compiler config at bootstrap by adding the 'MissingTranslationStrategy' property. The example below shows how to set the warning level to -error: +error. diff --git a/aio/content/guide/universal.md b/aio/content/guide/universal.md index 51fd65cdf1..4521251706 100644 --- a/aio/content/guide/universal.md +++ b/aio/content/guide/universal.md @@ -203,9 +203,9 @@ One solution is to provide the full URL to your application on the server, and w value and prepend it to the request URL. If you're using the `ngExpressEngine`, as shown in the example in this guide, half the work is already done. We'll assume this is the case, but it's trivial to provide the same functionality. -Start by creating an [HttpInterceptor](api/common/http/HttpInterceptor): +Start by creating an [HttpInterceptor](api/common/http/HttpInterceptor). - + import {Injectable, Inject, Optional} from '@angular/core'; import {HttpInterceptor, HttpHandler, HttpRequest, HttpHeaders} from '@angular/common/http'; @@ -233,9 +233,9 @@ export class UniversalInterceptor implements HttpInterceptor { -Next, provide the interceptor in the providers for the server `AppModule` (app.server.module.ts): +Next, provide the interceptor in the providers for the server `AppModule`. - + import {HTTP_INTERCEPTORS} from '@angular/common/http'; import {UniversalInterceptor} from './universal-interceptor'; diff --git a/aio/content/guide/web-worker.md b/aio/content/guide/web-worker.md index c7d51d4d0a..960973c315 100644 --- a/aio/content/guide/web-worker.md +++ b/aio/content/guide/web-worker.md @@ -13,16 +13,16 @@ Running this command will: - configure your project to use Web Workers, if it isn't already. - add `src/app/app.worker.ts` with scaffolded code to receive messages: - ```typescript + addEventListener('message', ({ data }) => { const response = `worker response to ${data}`; postMessage(response); }); - ``` + - add scaffolded code to `src/app/app.component.ts` to use the worker: - ```typescript + if (typeof Worker !== 'undefined') { // Create a new const worker = new Worker('./app.worker', { type: 'module' }); @@ -34,7 +34,7 @@ Running this command will: // Web Workers are not supported in this environment. // You should add a fallback so that your program still executes correctly. } - ``` + After the initial scaffolding, you will need to refactor your code to use the Web Worker by sending messages to and from.