2017-12-07 4 views
1

カスタムコンポーネントのレンダリングに問題があります。共有モジュールをNgModuleに入れても、レンダリングされません。 NgModuleにコンポーネントを追加するか、パラメータCUSTOM_ELEMENTS_SCHEMAを持つプロパティスキーマを追加する必要があるというエラーが表示されます。私は共有モジュールにコンポーネントを追加し、コンポーネントを共有モジュールを使用したい場所に共有モジュールを追加したと言いました。そして、私はCUSTOM_ELEMENTS_SCHEMAを試してみましたが、取り除かれてエラーが出ましたが、 "カスタム"コンポーネントの内容をレンダリングしてタグをレンダリングします。NgModuleに入れても角度2のコンポーネントがレンダリングされない

カスタムコンポーネントモジュール

checkbox.module.ts

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

import { CheckboxComponent } from './checkbox.component'; 

@NgModule({ 
    imports: [FormsModule], 
    exports: [CheckboxComponent], 
    declarations: [CheckboxComponent] 
}) 
export class CheckboxModule { } 

共有モジュール

shared.module.ts

編集:私は、共有モジュールおよびカスタム・コンポーネント・タグを使用しようとしています

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { CheckboxModule, CheckboxComponent } from '../components/checkbox'; 
@NgModule({ 
    imports: [ 
     CommonModule, 
     CheckboxModule 
    ], 
    declarations: [], 
    exports: [ CheckboxComponent ] 
}) 
export class SharedModule { } 

モジュール:

dashboard.module.ts

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { DashboardComponent } from './dashboard.component'; 
import { SharedModule } from '../shared/shared.module'; 
@NgModule({ 
    imports: [ 
     SharedModule, 
     CommonModule 
    ], 
    declarations: [DashboardComponent] 
}) 

export class DashboardModule { } 

、それはあなたが二つのモジュールでCheckboxComponentを宣言しているコンテンツのない

<app-checkbox _ngcontent-c1 name="sth"></app-checkbox> 

答えて

0

とタグのようにレンダリングします。

+0

私はcheckbox.module.tsの宣言を削除しようとしましたが、問題はまだ残っていますが、それを見ていただきありがとうございます。 –

0

同じコンポーネントを複数回宣言しました。あなたのユースケースに基づいて、すべてのコンポーネントを正確に1つのモジュールで宣言する必要があります。変数を宣言するのと同じように考えてください。一度だけ行うと、それを使い始めることができます。コンポーネントが宣言され、同じモジュールからエクスポートされた場合、そのコンポーネントは宣言されたモジュールだけでなく、ダウンストリームでも使用できます。

すでにFormsModuleからCheckboxComponentを宣言しているので、再度宣言またはエクスポートする必要はありません。モジュール全体をエクスポートすることを検討したいと思うかもしれません。

+0

私の間違いは間違っています。私は投稿を編集しましたが、 –

0

問題がどこにあったのでしょうか。 app.module.tsでは、dashboard.component.ts componnentを宣言する代わりに、dashboard.module.tsモジュールをインポートする必要がありました。可能であれば、モジュールを介してすべてを行う必要があると思います:)

私はこれが誰かを助けてくれることを願っています。

関連する問題