Acabo de crear un nuevo componente en mi propio proyecto, pero siempre recibo el mismo mensaje de error. Estoy seguro de que el código de inyección es correcto y la lógica de exportación de módulos y componentes también es correcta. No puedo entender lo que está mal.
encabezado personalizado.component.ts
import {Component, Input, ViewEncapsulation} from '@angular/core'; import {Router} from '@angular/router'; @Component({ selector: 'custom-header', templateUrl: './custom-header.component.html', encapsulation: ViewEncapsulation.None }) export class CustomHeaderComponent { @Input() parentPageTitle: string; @Input() pageTitle: string; @Input() createButtonName: string; @Input() createButtonFunction: () => void; /** * Constructor */ constructor( private _router: Router, ) { } }encabezado personalizado.module.ts
import {NgModule} from '@angular/core'; import {CustomHeaderComponent} from 'app/modules'; import {MatButtonModule} from '@angular/material/button'; import {CommonModule} from '@angular/common'; @NgModule({ declarations: [ CustomHeaderComponent, ], exports: [ CustomHeaderComponent, ], imports: [ MatButtonModule, CommonModule, ] }) export class CustomHeaderModule { }índice.ts
export * from './header/custom-header.module'; export * from './header/custom-header.component';Mensaje de error
core.mjs:6485 ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'CustomHeaderComponent') TypeError: Cannot read properties of undefined (reading 'CustomHeaderComponent') at Module.CustomHeaderComponent (custom-header.module.ts:11:26) at custom-header.module.ts:8:5 at Module.11151 (custom-header.module.ts:11:26) at __webpack_require__ (bootstrap:19:1) at Module.33630 (index.ts:8:60) at __webpack_require__ (bootstrap:19:1) at Module.3265 (ganymede-users.module.ts:22:30) at __webpack_require__ (bootstrap:19:1) at Module.50252 (custom-header.module.ts:11:26) at __webpack_require__ (bootstrap:19:1) at resolvePromise (zone.js:1213:1) at resolvePromise (zone.js:1167:1) at zone.js:1279:1 at ZoneDelegate.invokeTask (zone.js:406:1) at Object.onInvokeTask (core.mjs:25505:1) at ZoneDelegate.invokeTask (zone.js:405:1) at Zone.runTask (zone.js:178:1) at drainMicroTaskQueue (zone.js:582:1)Use OnChanges porque es un enlace de ciclo de vida que se llama cuando cambia cualquier propiedad vinculada a datos de una directiva:
import {Component, OnChanges, SimpleChanges, Input} from '@angular/core'; export class ChildComponent implements OnChanges { @Input() message = ''; ngOnChanges(changes: SimpleChanges) { if (this.message){ //do something here.... } } }