docs: replace `alert-is-helpful` with `alert is-helpful` (#26497)
PR Close #26497
This commit is contained in:
parent
638aaecc7d
commit
c3643615fc
|
@ -147,7 +147,7 @@ In TypeScript, an interface is a design-time artifact, and doesn't have a runtim
|
||||||
<code-example path="dependency-injection/src/app/providers.component.ts" region="provider-9-ctor-interface" linenums="false">
|
<code-example path="dependency-injection/src/app/providers.component.ts" region="provider-9-ctor-interface" linenums="false">
|
||||||
</code-example>
|
</code-example>
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
This might seem strange if you're used to dependency injection in strongly typed languages where an interface is the preferred dependency lookup key.
|
This might seem strange if you're used to dependency injection in strongly typed languages where an interface is the preferred dependency lookup key.
|
||||||
However, JavaScript, doesn't have interfaces, so when TypeScript is transpiled to JavaScript, the interface disappears.
|
However, JavaScript, doesn't have interfaces, so when TypeScript is transpiled to JavaScript, the interface disappears.
|
||||||
|
@ -180,7 +180,7 @@ the help of an `@Inject()` parameter decorator.
|
||||||
<code-example path="dependency-injection/src/app/app.component.2.ts" region="ctor" header="src/app/app.component.ts" linenums="false">
|
<code-example path="dependency-injection/src/app/app.component.2.ts" region="ctor" header="src/app/app.component.ts" linenums="false">
|
||||||
</code-example>
|
</code-example>
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
Although the `AppConfig` interface plays no role in dependency injection,
|
Although the `AppConfig` interface plays no role in dependency injection,
|
||||||
it supports typing of the configuration object within the class.
|
it supports typing of the configuration object within the class.
|
||||||
|
@ -293,7 +293,7 @@ When you provide multiple sets of routes using [RouterModule.forRoot](api/router
|
||||||
and [RouterModule.forChild](api/router/RouterModule#forchild) in a single module,
|
and [RouterModule.forChild](api/router/RouterModule#forchild) in a single module,
|
||||||
the [ROUTES](api/router/ROUTES) token combines all the different provided sets of routes into a single value.
|
the [ROUTES](api/router/ROUTES) token combines all the different provided sets of routes into a single value.
|
||||||
|
|
||||||
<div class="alert-is-helpful>
|
<div class="alert is-helpful>
|
||||||
|
|
||||||
Search for [Constants in API documentation](api?type=const) to find more built-in tokens.
|
Search for [Constants in API documentation](api?type=const) to find more built-in tokens.
|
||||||
|
|
||||||
|
@ -309,7 +309,7 @@ When providers are tree-shakable, the Angular compiler removes the associated
|
||||||
services from the final output when it determines that they are not used in your application.
|
services from the final output when it determines that they are not used in your application.
|
||||||
This significantly reduces the size of your bundles.
|
This significantly reduces the size of your bundles.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
Ideally, if an application isn't injecting a service, it shouldn't be included in the final output.
|
Ideally, if an application isn't injecting a service, it shouldn't be included in the final output.
|
||||||
However, Angular has to be able to identify at build time whether the service will be required or not.
|
However, Angular has to be able to identify at build time whether the service will be required or not.
|
||||||
|
@ -346,7 +346,7 @@ The service can be instantiated by configuring a factory function, as in the fol
|
||||||
|
|
||||||
<code-example path="dependency-injection/src/app/tree-shaking/service.0.ts" header="src/app/tree-shaking/service.0.ts" linenums="false"> </code-example>
|
<code-example path="dependency-injection/src/app/tree-shaking/service.0.ts" header="src/app/tree-shaking/service.0.ts" linenums="false"> </code-example>
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
To override a tree-shakable provider, configure the injector of a specific NgModule or component with another provider, using the `providers: []` array syntax of the `@NgModule()` or `@Component()` decorator.
|
To override a tree-shakable provider, configure the injector of a specific NgModule or component with another provider, using the `providers: []` array syntax of the `@NgModule()` or `@Component()` decorator.
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ DI is a coding pattern in which a class asks for dependencies from external sour
|
||||||
|
|
||||||
In Angular, the DI framework provides declared dependencies to a class when that class is instantiated. This guide explains how DI works in Angular, and how you use it to make your apps flexible, efficient, and robust, as well as testable and maintainable.
|
In Angular, the DI framework provides declared dependencies to a class when that class is instantiated. This guide explains how DI works in Angular, and how you use it to make your apps flexible, efficient, and robust, as well as testable and maintainable.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
You can run the <live-example></live-example> of the sample app that accompanies this guide.
|
You can run the <live-example></live-example> of the sample app that accompanies this guide.
|
||||||
|
|
||||||
|
@ -52,7 +52,7 @@ replace every use of the `HEROES` mock data.
|
||||||
|
|
||||||
The DI framework lets you supply data to a component from an injectable _service_ class, defined in its own file. To demonstrate, we'll create an injectable service class that provides a list of heroes, and register that class as a provider of that service.
|
The DI framework lets you supply data to a component from an injectable _service_ class, defined in its own file. To demonstrate, we'll create an injectable service class that provides a list of heroes, and register that class as a provider of that service.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
Having multiple classes in the same file can be confusing. We generally recommend that you define components and services in separate files.
|
Having multiple classes in the same file can be confusing. We generally recommend that you define components and services in separate files.
|
||||||
|
|
||||||
|
@ -238,7 +238,7 @@ If Angular can't find that parameter information, it throws an error.
|
||||||
Angular can only find the parameter information _if the class has a decorator of some kind_.
|
Angular can only find the parameter information _if the class has a decorator of some kind_.
|
||||||
The `@Injectable()` decorator is the standard decorator for service classes.
|
The `@Injectable()` decorator is the standard decorator for service classes.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
The decorator requirement is imposed by TypeScript. TypeScript normally discards parameter type information when it [transpiles](guide/glossary#transpile) the code to JavaScript. TypeScript preserves this information if the class has a decorator and the `emitDecoratorMetadata` compiler option is set `true` in TypeScript's `tsconfig.json` configuration file. The CLI configures `tsconfig.json` with `emitDecoratorMetadata: true`.
|
The decorator requirement is imposed by TypeScript. TypeScript normally discards parameter type information when it [transpiles](guide/glossary#transpile) the code to JavaScript. TypeScript preserves this information if the class has a decorator and the `emitDecoratorMetadata` compiler option is set `true` in TypeScript's `tsconfig.json` configuration file. The CLI configures `tsconfig.json` with `emitDecoratorMetadata: true`.
|
||||||
|
|
||||||
|
@ -295,7 +295,7 @@ When using `@Optional()`, your code must be prepared for a null value. If you
|
||||||
don't register a logger provider anywhere, the injector sets the
|
don't register a logger provider anywhere, the injector sets the
|
||||||
value of `logger` to null.
|
value of `logger` to null.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
|
|
||||||
`@Inject()` and `@Optional()` are _parameter decorators_. They alter the way the DI framework provides a dependency, by annotating the dependency parameter on the constructor of the class that requires the dependency.
|
`@Inject()` and `@Optional()` are _parameter decorators_. They alter the way the DI framework provides a dependency, by annotating the dependency parameter on the constructor of the class that requires the dependency.
|
||||||
|
|
||||||
|
|
|
@ -47,7 +47,7 @@ Make a note of the user name and project name in GitHub.
|
||||||
|
|
||||||
You can see your deployed page at `https://<user_name>.github.io/<project_name>/`.
|
You can see your deployed page at `https://<user_name>.github.io/<project_name>/`.
|
||||||
|
|
||||||
<div class="alert-is-helpful>
|
<div class="alert is-helpful>
|
||||||
|
|
||||||
Check out [angular-cli-ghpages](https://github.com/angular-buch/angular-cli-ghpages), a full featured package that does all this for you and has extra functionality.
|
Check out [angular-cli-ghpages](https://github.com/angular-buch/angular-cli-ghpages), a full featured package that does all this for you and has extra functionality.
|
||||||
|
|
||||||
|
@ -283,7 +283,7 @@ Configure the Angular Router to defer loading of all other modules (and their as
|
||||||
or by [_lazy loading_](guide/router#asynchronous-routing "Lazy loading")
|
or by [_lazy loading_](guide/router#asynchronous-routing "Lazy loading")
|
||||||
them on demand.
|
them on demand.
|
||||||
|
|
||||||
<div class="alert-is-helpful>
|
<div class="alert is-helpful>
|
||||||
|
|
||||||
#### Don't eagerly import something from a lazy-loaded module
|
#### Don't eagerly import something from a lazy-loaded module
|
||||||
|
|
||||||
|
|
|
@ -25,7 +25,7 @@ When you specify providers in the `@Injectable()` decorator of the service itsel
|
||||||
|
|
||||||
You're likely to inject `UserService` in many places throughout the app and will want to inject the same service instance every time. Providing `UserService` through the `root` injector is a good choice, and is the default that the [Angular CLI](cli) uses when you generate a service for your app.
|
You're likely to inject `UserService` in many places throughout the app and will want to inject the same service instance every time. Providing `UserService` through the `root` injector is a good choice, and is the default that the [Angular CLI](cli) uses when you generate a service for your app.
|
||||||
|
|
||||||
<div class="alert-is-helpful">
|
<div class="alert is-helpful">
|
||||||
<header>Platform injector</header>
|
<header>Platform injector</header>
|
||||||
|
|
||||||
When you use `providedIn:'root'`, you are configuring the root injector for the _app_, which is the injector for `AppModule`.
|
When you use `providedIn:'root'`, you are configuring the root injector for the _app_, which is the injector for `AppModule`.
|
||||||
|
|
Loading…
Reference in New Issue