- Root Module: modulo por defecto de angluar
- Core Module: son servicios que pueden ser usados en diferentes módulos y componentes recordar que los servicios que se inyecta en el provideIn : ‘root’ se puede usar en cualquier parte.
- Routing Module: son módulos especiales que declaran un enrutamiento de la aplicación
- Feature Domain Module:son los módulos específicos del negocio
- Shared Module:Se usan para componentes pipes y directivas que se quieran usar en toda la aplicación
Manejo de rutas
Qué aprenderás sobre Angular Router y programación modular
Creando rutas
Creando el Home
Página de categorías
Evitando doble subscribe
RouterLink y RouterActive
Ruta 404
Detalle de cada producto
Parametros URL
Módulos
LazyLoading y CodeSplitting
Programación Modular
Vistas anidadas
Creando el CMS Module
Creando en Website Module
Creando un Shared Module
Precarga de módulos
Precarga de módulos
All Modules y Custom Strategy
QuickLink Strategy
Guardianes
Conoce a los Guardianes
Implementando redirects
Estado de login
Guard para Admin
CanDeactivate
Deployment
Netlify Deployment
Despedida
Despedida
You don't have access to this class
Keep learning! Join and start boosting your career
If you already have an account,
Resources
To enable Lazy Loading and CodeSplitting techniques in Angular you have to build your applications in a modular way.
What are the modules in Angular
By default, Angular has only one module in the app.module.ts file. All your components, services, pipe, etc. are imported here. It uses a decorator called @ngModule() that looks similar to the following:
// app.module.ts@NgModule({ imports: [], // Imports from other modules.declarations: [], // Imports of the module's components.exports: [], // Exports of components or others to be used in other modules.providers: [], // Injection of services.bootstrap: [] // Import of the application's main component.})export class AppModule { }When modularizing an application, each module will have its own unique components, services or the files it will need.
Types of Modules in Angular
We can identify several types of modules. The AppModule is the root module that starts your application. There are Routing Modules for defining routes.
The Shared Module that has services or components shared by the whole application. The Feature/Domain Module that are modules specific to your application.
In this way, Angular builds an ecosystem of modules, being able to divide an APP into N parts to optimize performance and maintain an order in the source code to make it understandable and scalable.
Contributed by: Kevin Fiorentino.
Contributions 6
Questions 1
Sort by:
el tema de modularizar una aplicación me gusta mucho, porqué delega responsabilidades a cada módulo y no centraliza todas la responsabilidad dentro del appModulo o bueno, así es como lo miro yo ❄
La programación modular
La programación modular es un paradigma de programación que consiste en dividir un programa en módulos o subprogramas con el fin de hacerlo más legible y manejable.
-
Cada Módulo en Angular tiene asociados features y componentes específicos. A estos se les conoce como feature modules, pues están asociados a una funcionalidad específica.
-
Angular define los Módulos con el decorador @ngModule.
imports→ Importar a otros módulos.providers→ Permiten inyectar servicios o interceptors al módulo.- declarations → Definen los componentes, pipes y directivas que va a usar el módulo.
- exports → Permiten compartir características con los otros módulos.
- bootstrap → Es el componente de inicio. Por lo general solo lo tiene el módulo principal.
-
Nota: los servicios que tengan
provideIn: rootse pueden usar en cualquier módulo.
Los _providers _ son clases de tipo @Injectable que servirán para los artefactos (components, directives, pipes) que se coloquen en declarations, además también quedaran disponibles para aquellos otros módulos que importen este módulo que los contiene
Want to see more contributions, questions and answers from the community?