Muestra las diferencias entre dos versiones de la página.
Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
ada:howto:sicoferp:factory:new-migracion-sicoferp:front:base-component [2025/06/25 19:07] 192.168.175.164 |
ada:howto:sicoferp:factory:new-migracion-sicoferp:front:base-component [2025/06/25 19:21] (actual) 192.168.175.164 |
||
---|---|---|---|
Línea 3: | Línea 3: | ||
[[ada:howto:sicoferp:factory:new-migracion-sicoferp:front|←Regresar]] | [[ada:howto:sicoferp:factory:new-migracion-sicoferp:front|←Regresar]] | ||
- | Clase abstracta reutilizable en Angular para facilitar la creación de componentes que usen formularios, tablas, modales y alertas. Provee métodos y propiedades comunes que se pueden extender y personalizar según las necesidades del componente específico. | + | Clase abstracta reutilizable para facilitar la creación de componentes que usen formularios, tablas, modales y alertas. Provee métodos y propiedades comunes que se pueden extender y personalizar según las necesidades del componente específico. |
==== Objetivo ==== | ==== Objetivo ==== | ||
Línea 22: | Línea 22: | ||
* **FormBuilder** (`@angular/forms`): crea formularios reactivos fácilmente. | * **FormBuilder** (`@angular/forms`): crea formularios reactivos fácilmente. | ||
* **BreadcrumbService**: establece el breadcrumb de navegación (migas de pan). | * **BreadcrumbService**: establece el breadcrumb de navegación (migas de pan). | ||
- | |||
- | Estas dependencias se inyectan usando la función `inject()`. | ||
==== Propiedades ==== | ==== Propiedades ==== | ||
- | * **title / subTitle**: Títulos que pueden usarse para encabezados del componente. | + | * **title / subTitle**: Título para encabezados del componente. |
* **form**: Instancia del formulario reactivo principal del componente. | * **form**: Instancia del formulario reactivo principal del componente. | ||
* **tableConfig**: Configuración de comportamiento y estilo de la tabla. | * **tableConfig**: Configuración de comportamiento y estilo de la tabla. | ||
Línea 51: | Línea 49: | ||
}); | }); | ||
</code> | </code> | ||
- | |||
- | Es útil para componentes que tengan filtros simples. | ||
=== setBreadcrumb(items: BreadcrumbItem[]) === | === setBreadcrumb(items: BreadcrumbItem[]) === | ||
Línea 154: | Línea 150: | ||
</code> | </code> | ||
- | ==== Beneficios de esta clase base ==== | + | ==== Beneficios de esta clase ==== |
* Evita repetir lógica en múltiples componentes. | * Evita repetir lógica en múltiples componentes. |