Как импортировать сервис из другого модуля в Angular 6

Технология: с использованием angular 6, angular cli и машинописного текста.

Сценарий:

У меня есть модуль приложения и основной модуль

Я хочу, чтобы компоненты модулей моего приложения использовали службы из моего основного модуля.

Мой основной модуль содержит список услуг:

import { NgModule } from '@angular/core';

// Services
import { AuthService } from './services/auth.service';

@NgModule({
  declarations: [
  ],
  imports: [
  ],
  providers: [
    AuthService
  ]
})
export class CoreModule { }

Это модуль моего приложения:

import { BrowserModule } from '@angular/platform-browser';
import { CommonModule } from '@angular/common';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';

// Modules
import { CoreModule } from './core/core.module';

// Sections
import { COMPONENTS } from './components/index';
import { ROUTES } from './app.routes';

@NgModule({
  declarations: [
    AppComponent,
    COMPONENTS
  imports: [
    CommonModule,
    FormsModule,
    BrowserModule,
    HttpClientModule,
    ReactiveFormsModule,
    RouterModule.forRoot(ROUTES),
    CoreModule
  ],
  providers: [
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

Примечание. Как видите, я импортирую CoreModule.

Это мой компонент из модуля приложения (он вызывает основной модуль для получения AuthService):

import { Component } from '@angular/core';

// This Auth Service import not working (says service not exported)
import { AuthService } from '../../core/core.module';

@Component({
  selector: 'app-contact',
  templateUrl: './contact.component.html'
})
export class ContactComponent {

  constructor(
    private authService: AuthService
  ) {}
}

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

import { AuthService } from '../../core/core.module';

Я получаю ошибку:

Служба не является экспортированным членом основного модуля.

Результат. Я хочу, чтобы мой контактный компонент из модуля приложения импортировал службу основного модуля под названием AuthService.


person AngularM    schedule 12.12.2018    source источник
comment
Как выглядит ваша служба? (Просто декларация)   -  person DeborahK    schedule 13.12.2018
comment
Можете ли вы сделать репо, это небольшой тестовый стек?   -  person DeborahK    schedule 13.12.2018


Ответы (2)


Поскольку вы импортировали свой CoreModule в AppModule, где вы также декалировали свой ContactComponent (кажется, в COMPONENTS), и служба, и компонент принадлежат одному и тому же модулю < / strong> здесь, чтобы они могли видеть друг друга. Что нужно сделать в вашем ContactComponent, так это просто импортировать службу AuthService из ее реального местоположения (не ../../core/core.module).

import { AuthService } from ' <...>/auth.service';
person SeleM    schedule 12.12.2018
comment
Вам не нужно экспортировать услугу? - person DeborahK; 13.12.2018
comment
@DeborahK Как так? не следует или нельзя? - person SeleM; 13.12.2018
comment
В этом нет необходимости. См. Пример основного модуля здесь: angular.io/guide/styleguide#core-feature -module Обратите внимание, что он экспортирует только компоненты, но не услуги. - person DeborahK; 13.12.2018
comment
@DeborahK, это было поведение angular по умолчанию или недавно изменилось? Большое спасибо за совет. - person SeleM; 13.12.2018
comment
AFAIK, нам никогда не нужно было экспортировать услуги. Добавление их в массив провайдеров регистрирует их с помощью одного из инжекторов приложения. Затем инжектор управляет экземпляром. Экспорт ничего не делает. - person DeborahK; 13.12.2018
comment
Боже мой, большое спасибо! Я удалил эту часть из ответа, большое спасибо @DeborahK - person SeleM; 13.12.2018
comment
@DeborahK, какой смысл в том, чтобы я помещал службы в основной модуль, я мог бы также поместить их напрямую в модуль приложения? - person AngularM; 13.12.2018
comment
@AngularM Правильно. Больше нет смысла использовать основной модуль, особенно с новым свойством providedIn декоратора Injectable (новое в v6). Нет необходимости регистрировать услуги в модулях ВООБЩЕ. И да, StyleGuide нужно обновить. - person DeborahK; 13.12.2018

Если модуль правильно импортирован в корневой модуль, я думаю, что если вы добавите экспорт ... из ... в свой mymodule.module.ts:

import { MystuffService } from file 'mystuff.service'. 
export { MystuffService } from file 'mystuff.service'.

Затем вы можете импортировать свой сервис:

import { MystuffService } from 'mymodule.module'
person GPY    schedule 20.04.2021