Búsqueda de sitios web

angular - Angular2 importar componentes/servicios desde un módulo


Estoy trabajando en una aplicación final de Angular2 que (actualmente) tiene dos módulos:

  • MóduloCentral: Contiene componentes y servicios compartidos.
  • AppModule: El módulo raíz de la aplicación

AppModule :

/**
 * Created by jamdahl on 9/21/16.
 */

// Angular Imports
import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {HttpModule} from '@angular/http';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {CoreModule} from '../core-module/core.module';
import {UserService, AuthService, AuthComponent} from '../core-module/core.module';

// Components
import {HomePageComponent} from './components/home-page.component';

//import {enableProdMode} from '@angular/core';
//enableProdMode();

@NgModule({
    imports: [
        BrowserModule,
        HttpModule,
        FormsModule,
        ReactiveFormsModule,
        CoreModule
    ],
    declarations: [
        AuthComponent,
        HomePageComponent
    ],
    providers: [
        AuthService,
        UserService
    ],
    bootstrap: [
        HomePageComponent
    ]
})
export class AppModule {}

MóduloCentral :

/**
 * Created by jamdahl on 9/21/16.
 */

// Angular imports
import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {HttpModule} from '@angular/http';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';

// Class imports
import {User} from './classes/user.class';
import {Alert} from './classes/alert.class';

// Service imports
import {AuthService} from './services/auth.service';
import {UserService} from './services/user.service';

// Component imports
import {AuthComponent} from './components/auth.component';
import {SignInComponent} from './components/signin.component';
import {SignUpComponent} from './components/signup.component';

//import {enableProdMode} from '@angular/core';
//enableProdMode();

@NgModule({
    imports: [
        BrowserModule,
        HttpModule,
        FormsModule,
        ReactiveFormsModule
    ],
    declarations: [
        AuthComponent,
        SignInComponent,
        SignUpComponent
    ],
    providers: [],
    exports: [
        User,
        Alert,
        AuthService,
        UserService,
        AuthComponent
    ]
})
export class CoreModule {}

Cuando intento ejecutarlo, obtengo lo siguiente:

ERROR en ./src/view/app-module/app.module.ts (11,9): error TS2305: El módulo '"/Users/jamdahl/Web/Web-Scratch/Angular2-Express-Mongoose/src/view/core-module/core.module"' no tiene un miembro exportado 'UserService'.

ERROR en ./src/view/app-module/app.module.ts (11,22): error TS2305: El módulo '"/Users/jamdahl/Web/Web-Scratch/Angular2-Express-Mongoose/src/view/core-module/core.module"' no tiene un miembro exportado 'AuthService'.

ERROR en ./src/view/app-module/app.module.ts (11,35): error TS2305: El módulo '"/Users/jamdahl/Web/Web-Scratch/Angular2-Express-Mongoose/src/view/core-module/core.module"' no tiene un miembro exportado 'AuthComponent'.

¿Alguna idea de por qué esto no está funcionando? Mi objetivo aquí es definir ciertos componentes/servicios en un módulo para reutilizarlos en otros módulos que crearé. Necesito encontrar la manera correcta de hacer esto...

¡Gracias por cualquier ayuda!

Respuesta #1

Los servicios no necesitan ser añadidos a los exports de un NgModule.

proporciona ellos dentro de tu CoreModule o como ahora dentro de tu AppModule, pero impórtalos desde su archivo original...

O agregue un export {AuthService} from '..File..' a su CoreModule.

Solo puedes importar Componentes y Servicios desde un archivo donde estén exportados. Y no desde donde estén en la sección exports de un Módulo. ¡Es algo de Typescript y no de Angular! :)

Artículos relacionados