Ionic3レイジー読み込み予期しないディレクティブをインポートしました

Question

私はIonic3を使用していますが、起動時のパフォーマンスを向上させるためにレイジーローディングを実装中です。インポートした積極的なロードと完璧に働いた

loginemail.module.ts

import { NgModule } from '@angular/core'; 
import { IonicPageModule } from 'ionic-angular'; 
import { LoginEmailPage } from './loginemail'; 
import { ControlMessages } from '../validation/controlMessages'; 

@NgModule({ 
    declarations: [LoginEmailPage], 
    imports: [IonicPageModule.forChild(LoginEmailPage), ControlMessages], 
}) 
export class LoginEmailPageModule { } 

をあなたが見ることができるように、私は（カスタムコンポーネントである、ControlMessagesをインポートします。

私は次のように変換されていますin app.module.ts）。任意のアドバイスは感謝

core.es5.js:1085 ERROR Error: Uncaught (in promise): Error: Unexpected directive 'ControlMessages' imported by the module 'LoginEmailPageModule'. Please add a @NgModule annotation. 
Error: Unexpected directive 'ControlMessages' imported by the module 'LoginEmailPageModule'. Please add a @NgModule annotation. 

：しかし

、私はLoginEmailPageにアクセスしてみてください、私は、次のランタイムエラーを取得します。

p.s. ControlMessagesは、まだそれを使用する他のページのapp.module.tsにインポートされます。

controlMessages.ts

import { Component, Input } from '@angular/core'; 
import { FormControl } from '@angular/forms'; 
import { ValidationService } from './validationService'; 

@Component({ 
    selector: 'control-messages', 
    template: `<div *ngIf="errorMessage !== null">{{errorMessage}}</div>` 
}) 
export class ControlMessages { 
    @Input() control: FormControl; 

    constructor() { 

    } 

    get errorMessage(): string { 
    for (let propertyName in this.control.errors) { 
     if (this.control.errors.hasOwnProperty(propertyName) && this.control.touched) { 
     return ValidationService.getValidatorErrorMessage(propertyName, this.control.errors[propertyName]); 
     } 
    } 

    return null; 
    } 
} 

Answer 1

はControlMessagesModuleを作成し、むしろそれをインポートする必要があります。

import { NgModule } from '@angular/core'; 
import { IonicModule } from 'ionic-angular'; 
import { CommonModule } from '@angular/common'; 
import { ControlMessages } from './controlMessages'; 

@NgModule({ 
    declarations: [ControlMessages], 
    imports: [ 
    CommonModule, 
    IonicModule 
    ], 
    exports: [ControlMessages] 
}) 
export class ControlMessagesModule { } 

と

import { NgModule } from '@angular/core'; 
import { IonicPageModule } from 'ionic-angular'; 
import { LoginEmailPage } from './loginemail'; 
import { ControlMessagesModule } from '../validation/controlMessages.module'; 

@NgModule({ 
    declarations: [LoginEmailPage], 
    imports: [IonicPageModule.forChild(LoginEmailPage), ControlMessagesModule], 
    exports: [LoginEmailPage] 
}) 
export class LoginEmailPageModule { }