我正在使用 Akveo/ngx-admin 模板。我已经创建了一些我自己的模块并在其中,然后尝试在其上运行生产构建,但它给了我一些错误。所以我必须创建一个共享模块,并将所有模块放在共享模块的导入中,几乎所有错误都消失了,但这个错误。
错误:无法绑定到“种类”,因为它不是“ngx-fs-icon”的已知属性。1. 如果 'ngx-fs-icon' 是一个 Angular 组件并且它有 'kind' 输入,那么验证它是这个模块的一部分。2. 如果“ngx-fs-icon”是一个 Web 组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。
ngx-fs-icon 组件tree-grid.component.ts
默认在文件内部
@Component({
selector: 'ngx-fs-icon',
template: `
<nb-tree-grid-row-toggle [expanded]="expanded" *ngIf="isDir(); else fileIcon">
</nb-tree-grid-row-toggle>
<ng-template #fileIcon>
<nb-icon icon="file-text-outline"></nb-icon>
</ng-template>
`,
})
export class FsIconComponent {
@Input() kind: string;
@Input() expanded: boolean;
isDir(): boolean {
return this.kind === 'dir';
}
treegrid 组件是在表格模块内制作的,我在 SharedModule 的导入中添加了 TablesModule。
表.module.ts
import { NgModule } from '@angular/core';
import { NbCardModule, NbIconModule, NbInputModule, NbTreeGridModule } from '@nebular/theme';
import { Ng2SmartTableModule } from 'ng2-smart-table';
import { ThemeModule } from '../../@theme/theme.module';
import { TablesRoutingModule, routedComponents } from './tables-routing.module';
import { FsIconComponent } from './tree-grid/tree-grid.component';
@NgModule({
imports: [
NbCardModule,
NbTreeGridModule,
NbIconModule,
NbInputModule,
ThemeModule,
TablesRoutingModule,
Ng2SmartTableModule,
],
declarations: [
...routedComponents,
FsIconComponent,
],
})
export class TablesModule { }
shared.module.ts 文件
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import {
NbAccordionModule,
NbButtonModule,
NbCardModule,
NbListModule,
NbRouteTabsetModule,
NbStepperModule,
NbTabsetModule, NbUserModule,
NbRadioModule, NbSelectModule,
NbDatepickerModule, NbActionsModule,
NbCheckboxModule, NbAlertModule
} from '@nebular/theme';
import { AlertComponent } from '../extra-components/alert/alert.component';
import { NbIconModule, NbInputModule, NbTreeGridModule } from '@nebular/theme';
import { Ng2SmartTableModule } from 'ng2-smart-table';
import { ThemeModule } from '../../@theme/theme.module';
import { FormsRoutingModule } from '../forms/forms-routing.module';
import { TablesModule } from '../tables/tables.module';
import { FormsComponent } from '../forms/forms.component';
import { FormInputsComponent } from '../forms/form-inputs/form-inputs.component';
import { FormLayoutsComponent } from '../forms/form-layouts/form-layouts.component';
import { ButtonsComponent } from '../forms/buttons/buttons.component';
import { FsIconComponent } from '../tables/tree-grid/tree-grid.component';
import { DatepickerComponent } from '../forms/datepicker/datepicker.component';
@NgModule({
declarations: [],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
ThemeModule,
NbTabsetModule,
NbRouteTabsetModule,
NbStepperModule,
NbCardModule,
NbButtonModule,
NbListModule,
NbAccordionModule,
NbUserModule,
NbTreeGridModule,
NbIconModule,
NbInputModule,
ThemeModule,
// TablesRoutingModule,
Ng2SmartTableModule,
NbRadioModule,
NbSelectModule,
NbDatepickerModule,
NbActionsModule,
FormsRoutingModule,
NbCheckboxModule,
NbAlertModule,
TablesModule
]
})
export class SharedModule { }