角2 rc6コンポーネントがロードされていません

Question

APPをrc6にアップグレードした後、一部のコンポーネントがロード/レンダリングされません。 私のAPPではrouting_componentsとutil_componentsの違いがあります。私はすべてのrouting_componentsがうまく動作しており、util_componentsだけが問題を起こしていることに気付きました。

ブラウザコンソールにコンパイルエラーやエラーが表示されなくなりました。単にこれを得ました：

角度2は現像モードで実行されています。 enableProdMode（）を に呼び出して、運用モードを有効にします。ここで

私は私のコンポーネントを使用しています方法です：

<cl-largetext [options]="textTwo">Loading Text...</cl-largetext> 

そして、私はウェブサイト上で見るすべては次のとおりです。

読み込んでテキスト...

私は」すべてのコンポーネントに1つのモジュールを割り当て、4つのラッパーモジュールにコンポーネントモジュールをインポートします：

routing_module：保持しているすべてのモジュールをインポートするルーティングコンポーネント

util_module：保持しているすべてのモジュールをインポートするutilのコンポーネント

pipes_module：エクスポートするすべての私のカスタムパイプ

services_module：提供するすべての私のサービスの私

AppModuleすべてのラッパーモジュールをインポートします。

今、私はあなたにレンダリングされていない1 util_componentためhierachy紹介：

コンポーネント：

import { Component, Input } from '@angular/core'; 
import { LargetextI } from './../../../interfaces/largetext/largetext.interface.ts'; 
import '../../../../../public/css/styles.css'; 
@Component({ 
    selector: 'cl-largetext', 
    templateUrl: './largetext.component.html', 
    styleUrls: ['./largetext.component.css'] 
}) 
export class LargetextComponent { 
    constructor(){} 
    @Input() options: LargetextI; 
} 

コンポーネントのモジュール：

import { NgModule, CUSTOM_ELEMENTS_SCHEMA }  from '@angular/core'; 
import { CommonModule }  from '@angular/common'; 
import { LargetextComponent } from './../../../components/util_components/largetext/largetext.component.ts'; 

@NgModule({ 
    declarations: [ LargetextComponent ], 
    bootstrap: [ LargetextComponent ], 
    imports: [ CommonModule ], 
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ] 
}) 
export class LargetextModule { } 

を

Utilモジュール：

import { NgModule }  from '@angular/core'; 
import {LargetextModule} from "./largetext/largetext.module"; 
// ... more modules 
@NgModule({ 
    declarations: [ ], 
    bootstrap: [ ], 
    imports: [ LargetextModule, ... more modules ], 
    schemas: [ ] 
}) 
export class UtilModule { } 

マイAppModule：

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 
import { RouterModule } from '@angular/router'; 
import { AppComponent } from './app.component'; 
import { ROUTES } from './app.routes'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { HttpModule } from '@angular/http'; 
import { UtilModule} from "./modules/util_modules/util.module"; 
import { RoutingModule } from "./modules/routing_modules/routing.module"; 
import { ServicesModule } from "./modules/services_module/service.module"; 
import {PipesModule} from "./modules/util_modules/pipes.module"; 

@NgModule({ 
    bootstrap: [AppComponent], 
    declarations: [AppComponent], 
    imports: [ HttpModule, BrowserModule, UtilModule, RoutingModule, ServicesModule, PipesModule, RouterModule.forRoot(ROUTES, { useHash: false })], 
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ], 
    providers: [ ] 
}) 
export class AppModule { } 

マイmain.tsあなたの助けを

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { enableProdMode } from '@angular/core'; 
import { AppModule } from './app/app.module'; 

if (process.env.ENV === 'production') { 
    enableProdMode(); 
} 

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

感謝:)

乾杯！

Answer 1

1つのモジュール（AppModule）のみを使用してこれを修正しました。 AppComponentをブートストラップし、すべてのコンポーネントとパイプを宣言し、すべての角度モジュール（フォーム、ブラウザなど）をインポートし、パイプをエクスポートし、サービスを提供し、CUSTOM_ELEMENTS_SCHEMAを使用します。

しかし、これは機能しますが、ここではモジュールの目的を理解できません。多分誰かが説明することができますか？ mrgoosに答えるために

： NgModuleは、属性schmeasがありますhttps://angular.io/docs/ts/latest/api/core/index/NgModuleMetadataType-interface.html

Answer 2

app.moduleの場合はbootstrapが必要ですので、これから始めましょう。さらに、他のすべてのモジュールがCommonModuleをインポートしていることを確認してください。また、schemasは、文書によればNgModuleの一部ではありません。

すべてのモジュールのコンポーネントが宣言されていることを確認してください。たとえば、utilモジュールには宣言はありません。

まだ動作しない場合は、plnkrで共有してみてください。