我正在尝试在工作中实现星云,因此我正在遵循this星云教程进行锻炼。
我已经安装了星云状。它可以与<nb-layout>
<nb-header>
正常工作,但是当我使用<nb-actions>
或<nb-menu>
时,它会抛出以下错误
compiler.js:1021 Uncaught Error: Template parse errors:
'nb-action' is not a known element:
1. If 'nb-action' is an Angular component, then verify that it is part of this module.
2. If 'nb-action' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this
我不知道这是什么问题。如何解决?
side.html
<nb-layout>
<nb-layout-header subheader>
<nb-actions>
<nb-action icon="nb-home"></nb-action>
<nb-action icon="nb-search"></nb-action>
<nb-action icon="nb-edit"></nb-action>
</nb-actions>
</nb-layout-header>
</nb-layout>
side.ts //组件
import {Component} from '@angular/core';
@Component({
selector:"sidebar",
templateUrl:"./side.html",
styleUrls:["side.css"]
})
export class sideComponent{
}
sbar.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule,Routes } from '@angular/router';
import { NbSidebarModule, NbLayoutModule, NbSidebarService } from '@nebular/theme';
import {sideComponent} from "./sidecomp/side";
const routes: Routes = [{path:"sidebar",component:sideComponent}]
@NgModule({
declarations:[
sideComponent
],
imports: [
CommonModule,
RouterModule.forRoot(routes, { useHash: true }),
NbSidebarModule,
NbLayoutModule
],
providers:[NbSidebarService],
exports:[sideComponent]
})
export class SbarModule { }
答案 0 :(得分:2)
确保已导入 NbLayoutModule
@NgModule({
imports: [
NbSidebarModule,
NbLayoutModule
]
您的错误也显示nb-action,而应该是 nb-actions
,请确保您没有错字
编辑
您还需要导入NbActionsModule
。检查代码 here
答案 1 :(得分:1)
您必须在您的App模块以及任何子模块中导入NbLayoutModule。
@NgModule({
imports: [
// ...
NbLayoutModule.forRoot(),
],
})
export class AppModule { }
在您的子模块中导入为
@NgModule({
imports: [
// ...
NbLayoutModule,
],
})
export class PageModule { }
答案 2 :(得分:-1)
导入 NbActionsModule 模块。它会起作用