Angular2 Управление большим количеством компонентов

Question

Я работаю над Angular2. Как мы знаем, нам нужно настроить все providers, components, services в основном модуле. Это может быть тот случай, когда у нас есть большое количество components и вручную настроить его. Например, рассмотрим следующее module

 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
 import { HttpModule } from '@angular/http';
 import { AppComponent } from './app.component';
 import { GoogleSigninComponent } from ./auth/google.login.component';
 import { ApiEndpoints } from './api.endpoints';
 // Providers
 import { AuthService } from './auth/auth.service';
 import { AppRoutingModule } from './route';
 import { ExpenseComponent } from './expense/expense.component';
 import { ExpenseService } from './expense/expense.service';

 import { GroupService } from './group/group.service';
 import {GroupUserService} from './group/group-user.service';
 import {MainGroupComponent, SaveGroupComponent, GroupListComponent } from './group/group.components';
 import {GroupUsersComponent,AddGroupUserComponent} from './group/group-  user.component';
 import {HelperService } from './helper.service';
 import {SearchUserComponent} from './user/users.component';
 import {UserService} from './user/users.service';


@NgModule({
  imports: [BrowserModule, HttpModule, BrowserModule, AppRoutingModule, FormsModule],
  declarations: [AppComponent, GoogleSigninComponent,
  ExpenseComponent, SaveGroupComponent, GroupListComponent, GroupUsersComponent,
MainGroupComponent,AddGroupUserComponent,SearchUserComponent],
 bootstrap: [AppComponent],
 providers: [AuthService, ApiEndpoints, ExpenseService,
 GroupService,GroupUserService,HelperService,UserService]
  })

Мне нужно настроить то же самое в routes и несколько cubersome Как правильно настроить такое большое количество компонентов без особого копирования?

Также я считаю, что должно быть несколько модулей. Каково ваше предложение или правильный способ сделать это?

Answer 1

Для сервиса создайте отдельный файл shared.ts и импортируйте и экспортируйте все сервисы. Таким образом, для каждого файла создайте файл.ts, как этот. Например, см. Код ниже.

import { GroupService } from './group/group.service';
import {GroupUserService} from './group/group-user.service';

const SHARED_PROVIDERS: any[] = [
  GroupService ,
  GroupUserService
];

    export{
    Shared_Providers,
    GroupService ,
    GroupUserService

    }