Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

151
Vistas
Dependency injection in parent and child component in Angular

I was having issues with a test in angular . The strange thing was the tests succeeded with

ng test

and failed with

ng test --watch=false --browsers=ChromeHeadless --code-coverage

But adding constructor in the child component solved the issue.

Parent component :

 Component({
  templateUrl: './edit-organization.component.html',
  styleUrls: ['./edit-organization.component.scss']
})
export class EditOrganizationComponent implements OnInit {
  organization: Organization;
  errorReason: ErrorReason;
  organization$: Observable<Organization>;
  errorCodes: ErrorCode[];

  constructor(
    protected currentUserRoute: ActivatedRoute,
    protected organizationService: OrganizationService,
    protected navigationService: NavigationService
  ) { }

  ngOnInit(): void {
    this.organization = this.currentUserRoute.snapshot.data.organization;
  }

  updateOrganization(form: NgForm) { ...}

Child component 1 (The test used to fail here)

@Component({
  templateUrl: './edit-business-organization-profile.component.html',
})
export class EditBusinessOrganizationProfileComponent
  extends EditOrganizationComponent
  implements OnInit
{
  organizationServiceTypes: OrganizationServiceType[] =
    organizationServiceTypes;

  constructor(readonly currentUserRoute: ActivatedRoute,
              readonly organizationService: OrganizationService,
              readonly navigationService: NavigationService) {
    super(currentUserRoute, organizationService, navigationService);
  }
  ngOnInit(): void {
    super.ngOnInit();
  }
}

Child component 2 (The tests pass here)

@Component({
  templateUrl: './business-organization-profile.component.html',
})
export class BusinessOrganizationProfileComponent
  extends EditOrganizationComponent
  implements OnInit {
  ngOnInit(): void {
    super.ngOnInit();
  }
}

I have a almost similar test for both the component which were passing before but when I added a field organizationServiceTypes in EditBusinessOrganizationProfileComponent the tests started failing .

Earlier I didn't have any constructor in the component EditBusinessOrganizationProfileComponent, once I added the constructor the tests started getting passed.

Can someone explain how the dependency injection works in this case as the code works perfectly without the test , it is only the test that breaks ?

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda