Могу ли я использовать службу на компоненте, предоставленную из общего модуля?

Question

Я не знаю, возможно ли то, что я пытаюсь сделать. Я импортировал SharedModule в AppModule с помощью метода forRoot. И затем я импортировал SharedModule для общего компонента, который мне нужен, например:

App.module.ts :

> import { BrowserModule } from '@angular/platform-browser'; import {
> NgModule } from '@angular/core'; import { SharedModule } from
> './shared/shared.module'; import { HttpClientModule } from
> '@angular/common/http'; import { AppComponent } from
> './app.component'; import { ClinicaComponent } from
> './clinica/clinica.component'; import { ClinicaModule } from
> './clinica/clinica.module'; import { AppRoutingModule } from
> './/app-routing.module'; import { ProfesionalComponent } from
> './profesional/profesional.component'; import { ProfesionalModule }
> from './profesional/profesional.module';
> 
> @NgModule({
>     imports: [
>         BrowserModule,
>         ClinicaModule,
>         ProfesionalModule,
>         SharedModule.forRoot(),
>         AppRoutingModule,
>         HttpClientModule,
>     ],
>     declarations: [
>       ClinicaComponent,
>       AppComponent,
>       ProfesionalComponent
> 
>     ],
>     providers: [],
>     bootstrap: [AppComponent] }) export class AppModule { }

Shared.module.ts :

export const GlobalProviders = [ //para los global providers
  {
        provide: AuthServiceConfig,
        useFactory: getAuthServiceConfigs
      },
   AuthenticationService, UserService, AlertService, ProfesionalService, ServiciosService, ClinicService
];
@NgModule({
    imports: [
        CommonModule,
        //SharedRoutingModule,
        FormsModule,
        ReactiveFormsModule,
        SocialLoginModule
    ],
    declarations: [LoginComponent,
       HeaderComponent,
       NotFoundComponent,
       MyfooterComponent,
       RequiredLabelDirective],
    exports: [
        RouterModule,
        HeaderComponent,
        MyfooterComponent,
        RequiredLabelDirective,
        FormsModule,
        ReactiveFormsModule
    ]
})
export class SharedModule {

   static forRoot(): ModuleWithProviders {
        return {
            ngModule: SharedModule,
            providers: [GlobalProviders]
        };
    }

Итак, я хочу использовать GlobalProviders из одноуровневого компонента Profesional Component, MisDatosComponent. Это мой profesional.component.ts :

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { GestionProfesionalesComponent } from './gestion-profesionales/gestion-profesionales.component';
import { MisDatosComponent } from './profile/profile.component';
import { SharedModule } from '../shared/shared.module';

@NgModule({
  imports: [
    CommonModule,
    SharedModule
  ],
  declarations: [ MisDatosComponent, GestionProfesionalesComponent]
})
export class ProfesionalModule { }

Это структура проекта, чтобы вы меня поняли:

структура

Поэтому я подумал, что когда я импортировал sharedModule в ProfesionalModule, а также, когда я импортировал sharedModule в ProfileComponent, я мог использовать сервис, который предоставляет sharedModule. Но он не распознал это, и я должен импортировать сервисы один за другим в ProfileComponent. Кто-то, кто может мне помочь ???

Answer 1

Чтобы ответить на ваш вопрос буквально, да. Если вы добавляете сервисы в массив провайдеров ngModule, а затем импортируете первый ngModule первым, компоненты второго будут иметь доступ к провайдерам первого.

Эта статья из документации содержит хорошее объяснение, в том числе способы ограничения общего доступа этого провайдера, когда он нежелателен: https://angular.io/guide/providers#providedin-and-ngmodules