別のモジュールからコンポーネントを参照する

Question

角度4気圧で作業する。 別のモジュールのコンポーネントを参照する際に問題が発生しました。

だから私は次のように定義されてEngagementModuleと呼ばれるモジュールがあります。

import { NgModule } from '@angular/core'; 
import { EngagementRoutingModule } from "./engagement.routes"; 
import { CreateEngagementComponent } from "./create-engagement.component"; 
import { EngagementItemComponent } from "./engagement-item.component"; 
import { EngagementListComponent } from "./engagement-list.component"; 
import EngagementFilterPipe from "./engagement-filter.pipe"; 
import { EngagementRouteActivator } from "./engagement-route-activator.service"; 
import { checkEngagementNewDirty } from "../shared/utils"; 
import { EngagementDetailsComponent } from "./engagement-details/engagement-details.component"; 
import { HttpModule } from "@angular/http"; 
import { FormsModule, ReactiveFormsModule } from "@angular/forms"; 
import { TaskService } from "../tasks/task.service"; 
import { UtilsModule } from "../shared/utils.module"; 
import { CommonModule } from "@angular/common"; 
import { EngagementEditComponent } from "./engagement-edit.component"; 
import { TagInputModule } from 'ng2-tag-input'; 
import { ObserverComponent } from "./engagement-details/observer.component"; 

@NgModule({ 
    imports: [ 
    CommonModule, 
    FormsModule, 
    HttpModule, 
    EngagementRoutingModule, 
    UtilsModule, 
    ReactiveFormsModule, 
    TagInputModule, 
    ], 
    exports: [EngagementListComponent, EngagementItemComponent, EngagementFilterPipe], 
    declarations: [ObserverComponent, CreateEngagementComponent, EngagementDetailsComponent, EngagementItemComponent, EngagementListComponent, EngagementFilterPipe, EngagementEditComponent], 
    providers: [EngagementRouteActivator, TaskService, 
    { 
      provide : 'canDeactivateCreateEngagement', 
      useValue : checkEngagementNewDirty 
    }], 
}) 
export class EngagementModule { } 

と宣言し、輸出部品EngagementListComponent：

import {Component, OnInit, Inject} from "@angular/core"; 
import {Task,Engagement, TaskStatus, TSToken, ITaskService} from "../model"; 
import {MessageService} from "../shared/message.service"; 
import {TaskService} from "../tasks/task.service"; 
import {ActivatedRoute} from "@angular/router"; 

@Component({ 
    selector : "engagement-list" , 
    templateUrl : "./app/engagements/engagement-list.component.html", 
    providers : [TaskService, MessageService], 
}) 
export class EngagementListComponent implements OnInit { 
(...) 

そして、私のメインのアプリモジュールでは、イムは次のようにこのモジュールをインポートしますso：

import { TagInputModule } from 'ng2-tag-input'; 
import {platformBrowserDynamic} from "@angular/platform-browser-dynamic"; 
import {NgModule} from "@angular/core"; 
import {BrowserModule} from "@angular/platform-browser"; 
import {AppComponent} from "./app.component"; 
import { 
    TaskListComponent, 
    TaskDetailsComponent, 
    TaskRouteActivator, 
    TaskService, 
    TaskAditComponent 
} from './tasks/index'; 
import {routing} from './app.routes'; 
import {HttpModule} from "@angular/http"; 
import BarGraphComponent from "./dashboard/bar-graph.component" 
import {FormsModule} from "@angular/forms"; 
//import {UserInfoComponent} from "./user/user-info.component"; 
//import {UserSettingsComponent} from "./user/user-settings.component"; 
import { NavComponent} from "./nav/nav.component"; 

// errors 
import {Error404Component} from "./errors/404.component"; 

import "./prod"; // import for side effect. 
import { UtilsModule } from "./shared/utils.module"; 
import { AuthService } from "./user/auth.service"; 
import { UsersService } from "./user/users.service"; 
import { GuardsService } from "./shared/guards.service"; 
import { SearchService } from "./shared/search.service"; 
import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; 
import { CommonModule } from "@angular/common"; 
import { DashboardComponent } from "./dashboard/dashboard.component"; 

/* HMM */ 
import { EngagementModule } from "./engagements/engagement.module"; 

@NgModule({ 
    imports: [CommonModule, BrowserAnimationsModule, routing,FormsModule, HttpModule, UtilsModule], 
    providers: [ 
     TaskRouteActivator, 
     TaskService, 
     UsersService, 
     AuthService, 
     GuardsService, 
     SearchService, 
     TagInputModule, 
     EngagementModule 
    ], 
    declarations: [ DashboardComponent, AppComponent, TaskDetailsComponent, TaskListComponent, TaskAditComponent, BarGraphComponent, Error404Component, /* UserInfoComponent, UserSettingsComponent, */NavComponent], 
    bootstrap: [AppComponent]  
}) 
class AppModule { } 

const platform = platformBrowserDynamic(); 
platform.bootstrapModule(AppModule); 

今、私が理解しているところから - テAppModuleで宣言されたコンポーネント（DashboardComponent）のmplateでは、テンプレートで使用できるはずです。しかし、その代わりに、私が取得しています：

未処理の約束の拒絶反応を：テンプレートは、エラーを解析：「婚約-list」の が知られている要素ではありません。私は何をしないのです

？

Answer 1

TagInputModule,EngagementModule~importsは、providersである。

importsは、モジュールをインポートするためのもので、providersはサービスです。