docs: remove prerequisite section in NgModules docs (#31169)
PR Close #31169
This commit is contained in:
parent
12fd06916b
commit
fc61284dbe
@ -1,12 +1,5 @@
|
||||
# Entry Components
|
||||
|
||||
#### Prerequisites:
|
||||
|
||||
A basic understanding of the following concepts:
|
||||
* [Bootstrapping](guide/bootstrapping).
|
||||
|
||||
<hr />
|
||||
|
||||
An entry component is any component that Angular loads imperatively, (which means you’re not referencing it in the template), by type. You specify an entry component by bootstrapping it in an NgModule, or including it in a routing definition.
|
||||
|
||||
<div class="alert is-helpful">
|
||||
|
@ -2,12 +2,6 @@
|
||||
|
||||
Feature modules are NgModules for the purpose of organizing code.
|
||||
|
||||
#### Prerequisites
|
||||
A basic understanding of the following:
|
||||
* [Bootstrapping](guide/bootstrapping).
|
||||
* [JavaScript Modules vs. NgModules](guide/ngmodule-vs-jsmodule).
|
||||
* [Frequently Used Modules](guide/frequent-ngmodules).
|
||||
|
||||
For the final sample app with a feature module that this page describes,
|
||||
see the <live-example></live-example>.
|
||||
|
||||
|
@ -1,12 +1,5 @@
|
||||
# Frequently Used Modules
|
||||
|
||||
#### Prerequisites
|
||||
|
||||
A basic understanding of [Bootstrapping](guide/bootstrapping).
|
||||
|
||||
|
||||
<hr>
|
||||
|
||||
An Angular app needs at least one module that serves as the root module.
|
||||
As you add features to your app, you can add them in modules.
|
||||
The following are frequently used Angular modules with examples
|
||||
|
@ -1,23 +1,13 @@
|
||||
# Lazy Loading Feature Modules
|
||||
|
||||
#### Prerequisites
|
||||
A basic understanding of the following:
|
||||
* [Feature Modules](guide/feature-modules).
|
||||
* [JavaScript Modules vs. NgModules](guide/ngmodule-vs-jsmodule).
|
||||
* [Frequently Used Modules](guide/frequent-ngmodules).
|
||||
* [Types of Feature Modules](guide/module-types).
|
||||
* [Routing and Navigation](guide/router).
|
||||
|
||||
For the final sample app with two lazy loaded modules that this page describes, see the
|
||||
<live-example></live-example>.
|
||||
|
||||
<hr>
|
||||
|
||||
## High level view
|
||||
|
||||
By default, NgModules are eagerly loaded, which means that as soon as the app loads, so do all the NgModules, whether or not they are immediately necessary. For large apps with lots of routes, consider lazy loading—a design pattern that loads NgModules as needed. Lazy loading helps keep initial
|
||||
bundle sizes smaller, which in turn helps decrease load times.
|
||||
|
||||
For the final sample app with two lazy loaded modules that this page describes, see the
|
||||
<live-example></live-example>.
|
||||
|
||||
There are three main steps to setting up a lazy loaded feature module:
|
||||
|
||||
1. Create the feature module.
|
||||
|
@ -1,16 +1,5 @@
|
||||
|
||||
|
||||
# Types of Feature Modules
|
||||
|
||||
#### Prerequisites
|
||||
|
||||
A basic understanding of the following concepts:
|
||||
* [Feature Modules](guide/feature-modules).
|
||||
* [JavaScript Modules vs. NgModules](guide/ngmodule-vs-jsmodule).
|
||||
* [Frequently Used Modules](guide/frequent-ngmodules).
|
||||
|
||||
<hr>
|
||||
|
||||
There are five general categories of feature modules which
|
||||
tend to fall into the following groups:
|
||||
|
||||
|
@ -1,15 +1,5 @@
|
||||
# NgModule API
|
||||
|
||||
#### Prerequisites
|
||||
|
||||
A basic understanding of the following concepts:
|
||||
* [Bootstrapping](guide/bootstrapping).
|
||||
* [JavaScript Modules vs. NgModules](guide/ngmodule-vs-jsmodule).
|
||||
|
||||
<hr />
|
||||
|
||||
## Purpose of `@NgModule`
|
||||
|
||||
At a high level, NgModules are a way to organize Angular apps
|
||||
and they accomplish this through the metadata in the `@NgModule`
|
||||
decorator.
|
||||
|
@ -1,13 +1,5 @@
|
||||
# NgModule FAQs
|
||||
|
||||
|
||||
#### Prerequisites:
|
||||
|
||||
A basic understanding of the following concepts:
|
||||
* [NgModules](guide/ngmodules).
|
||||
|
||||
<hr />
|
||||
|
||||
NgModules help organize an application into cohesive blocks of functionality.
|
||||
|
||||
This page answers the questions many developers ask about NgModule design and implementation.
|
||||
|
@ -1,13 +1,9 @@
|
||||
# JavaScript Modules vs. NgModules
|
||||
|
||||
#### Prerequisites
|
||||
A basic understanding of [JavaScript/ECMAScript modules](https://hacks.mozilla.org/2015/08/es6-in-depth-modules/).
|
||||
|
||||
<hr>
|
||||
|
||||
JavaScript and Angular use modules to organize code, and
|
||||
though they organize it differently, Angular apps rely on both.
|
||||
|
||||
|
||||
## JavaScript modules
|
||||
|
||||
In JavaScript, modules are individual files with JavaScript code in them. To make what’s in them available, you write an export statement, usually after the relevant code, like this:
|
||||
@ -24,6 +20,8 @@ import { AppComponent } from './app.component';
|
||||
|
||||
JavaScript modules help you namespace, preventing accidental global variables.
|
||||
|
||||
For more information on JavaScript modules, see [JavaScript/ECMAScript modules](https://hacks.mozilla.org/2015/08/es6-in-depth-modules/).
|
||||
|
||||
## NgModules
|
||||
|
||||
<!-- KW-- perMisko: let's discuss. This does not answer the question why it is different. Also, last sentence is confusing.-->
|
||||
|
@ -1,16 +1,10 @@
|
||||
# Providers
|
||||
|
||||
#### Prerequisites:
|
||||
* A basic understanding of [Bootstrapping](guide/bootstrapping).
|
||||
* Familiarity with [Frequently Used Modules](guide/frequent-ngmodules).
|
||||
A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide.
|
||||
|
||||
For the final sample app using the provider that this page describes,
|
||||
see the <live-example></live-example>.
|
||||
|
||||
<hr>
|
||||
|
||||
A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide.
|
||||
|
||||
## Providing a service
|
||||
|
||||
If you already have an app that was created with the [Angular CLI](cli), you can create a service using the [`ng generate`](cli/generate) CLI command in the root project directory. Replace _User_ with the name of your service.
|
||||
|
@ -1,18 +1,5 @@
|
||||
# Sharing Modules
|
||||
|
||||
#### Prerequisites
|
||||
A basic understanding of the following:
|
||||
* [Feature Modules](guide/feature-modules).
|
||||
* [JavaScript Modules vs. NgModules](guide/ngmodule-vs-jsmodule).
|
||||
* [Frequently Used Modules](guide/frequent-ngmodules).
|
||||
* [Routing and Navigation](guide/router).
|
||||
* [Lazy loading modules](guide/lazy-loading-ngmodules).
|
||||
|
||||
|
||||
<!--* Components (#TBD) We don’t have a page just on the concept of components, but I think one would be helpful for beginners.-->
|
||||
|
||||
<hr>
|
||||
|
||||
Creating shared modules allows you to organize and streamline your code. You can put commonly
|
||||
used directives, pipes, and components into one module and then import just that module wherever
|
||||
you need it in other parts of your app.
|
||||
@ -54,7 +41,7 @@ to import `FormsModule`, `SharedModule` can still export
|
||||
way, you can give other modules access to `FormsModule` without
|
||||
having to import it directly into the `@NgModule` decorator.
|
||||
|
||||
### Using components vs services from other modules.
|
||||
### Using components vs services from other modules
|
||||
|
||||
There is an important distinction between using another module's component and
|
||||
using a service from another module. Import modules when you want to use
|
||||
|
@ -1,15 +1,10 @@
|
||||
# Singleton services
|
||||
|
||||
#### Prerequisites:
|
||||
|
||||
* A basic understanding of [Bootstrapping](guide/bootstrapping).
|
||||
* Familiarity with [Providers](guide/providers).
|
||||
A singleton service is a service for which only once instance exists in an app.
|
||||
|
||||
For a sample app using the app-wide singleton service that this page describes, see the
|
||||
<live-example name="ngmodules"></live-example> showcasing all the documented features of NgModules.
|
||||
|
||||
<hr />
|
||||
|
||||
## Providing a singleton service
|
||||
|
||||
There are two ways to make a service a singleton in Angular:
|
||||
|
Loading…
x
Reference in New Issue
Block a user