我已经为prime https://www.primefaces.org/primeng/#/card创建了单独的自定义模块。
自定义模块仅包含与primeng相关的模块。
使用自定义模块不起作用
我收到如下所示的错误。
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { FirstComponent } from './first/first.component';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { PrimecustomModule } from './primeng.custom.module';
@NgModule({
declarations: [
AppComponent,
FirstComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule,
FormsModule,
PrimecustomModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
**customModule**
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import {DataTableModule} from 'primeng/datatable';
import {TriStateCheckboxModule} from 'primeng/tristatecheckbox';
import {CheckboxModule} from 'primeng/checkbox';
import {ListboxModule} from 'primeng/listbox';
import {EditorModule} from 'primeng/editor';
import {CardModule} from 'primeng/card';
@NgModule({
declarations: [],
imports: [
CommonModule,
DataTableModule,
TriStateCheckboxModule,
CheckboxModule,
ListboxModule,
ReactiveFormsModule,
FormsModule,
EditorModule,
CardModule
],
exports: []
})
export class PrimecustomModule { }
答案 0 :(得分:1)
当前,您的primeng.custom.module.ts
并未导出任何内容供您的app.module.ts
导入。
要解决此问题,您还需要将每个PrimeNG模块添加到自定义模块中的exports
数组中。这样便可以将它们导入到应用模块中。
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { DataTableModule } from 'primeng/datatable';
import { TriStateCheckboxModule } from 'primeng/tristatecheckbox';
import { CheckboxModule } from 'primeng/checkbox';
import { ListboxModule } from 'primeng/listbox';
import { EditorModule } from 'primeng/editor';
import { CardModule } from 'primeng/card';
@NgModule({
declarations: [],
imports: [
CommonModule,
DataTableModule,
TriStateCheckboxModule,
CheckboxModule,
ListboxModule,
ReactiveFormsModule,
FormsModule,
EditorModule,
CardModule
],
exports: [
CommonModule,
DataTableModule,
TriStateCheckboxModule,
CheckboxModule,
ListboxModule,
ReactiveFormsModule,
FormsModule,
EditorModule,
CardModule
]
})
export class PrimecustomModule { }
答案 1 :(得分:1)
如果要将自定义模块用于主要ng组件,则应执行3个步骤:
1-创建一个自定义模块,并将prime ng模块导入该模块中。那么您应该将模块的名称放在@NgModule中的imports数组中。
2- @ NgModule中还有另一个名称是exports。这是另一个数组。您应该将模块的名称放在导出数组中。
3-您应该在应用程序的app.module中添加自定义模块。
这是给你的一个例子:
在primeng.module.ts
中 import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {ConfirmDialogModule} from 'primeng/confirmdialog';
import {ButtonModule} from 'primeng/button';
import {DialogModule} from 'primeng/dialog';
import {MessageModule} from 'primeng/message';
import {SidebarModule} from 'primeng/sidebar';
import {TableModule} from 'primeng/table';
import {FileUploadModule} from 'primeng/fileupload';
import {ToastModule} from 'primeng/toast';
import { MessageService } from 'primeng/components/common/messageservice';
@NgModule({
declarations: [],
imports: [
CommonModule,
ConfirmDialogModule,
ButtonModule,
DialogModule,
MessageModule,
SidebarModule,
TableModule,
FileUploadModule,
ToastModule
],
exports:[ToastModule,FileUploadModule
,ConfirmDialogModule,ButtonModule,DialogModule
,MessageModule,SidebarModule,TableModule],
providers:[MessageService]
})
export class PrimengModule { }
然后您应该在app.module中注册该模块
import { PrimengModule } from './primeng/primeng.module';
并将此模块添加到app.module的导入数组中
imports: [
PrimengModule
]