1

我在渲染自定义组件时遇到问题。即使我将共享模块放在 NgModule 中，它也不会呈现。我收到一个错误，提示我应该将组件添加到 NgModule 或使用参数 CUSTOM_ELEMENTS_SCHEMA 添加属性模式。正如我所说，我将组件添加到共享模块并将共享模块添加到我想要使用它的组件。然后我尝试使用 CUSTOM_ELEMENTS_SCHEMA，我摆脱了错误，但它没有呈现“自定义”组件的内容，它只是呈现标签和 comp。

自定义组件模块

复选框.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 { }

我尝试使用共享模块和自定义组件标签的模块：

仪表板.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 { }

它呈现为一个没有内容的标签

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

3 回答 3

0

您在两个模块中声明 CheckboxComponent。在共享模块中声明就足够了

于 2017-12-07T09:28:13.427 回答
0

您已多次声明相同的组件。根据您的用例，每个组件都应该在一个模块中声明。将其视为与声明变量相同的方式-您只需执行一次，然后就可以开始使用它。如果一个组件是从同一个模块声明和导出的，那么该组件也可以在下游使用，而不仅仅是声明它的模块。

由于您已经从 FormsModule 中声明了 CheckboxComponent，因此无需再次声明或导出它。话虽如此，如果这样做有意义，您可能需要考虑导出整个模块：

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

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

@NgModule({
    imports: [FormsModule],
    exports: [FormsModule]
})
export class CheckboxModule { }
于 2017-12-07T09:28:28.480 回答
0

我发现问题出在哪里。在 app.module.ts 中，我必须导入dashboard.module.ts 模块，而不是声明dashboard.component.ts 组件。我想如果可能的话，一切都应该通过模块来完成:)

我希望这可以帮助别人。

于 2017-12-07T18:39:28.870 回答