[英]How to properly implement a sidebar in Nebular?
It displays a blank page when I add sidebar.当我添加侧边栏时它显示一个空白页面。 It does not give me any error messages.
它没有给我任何错误信息。 If I remove it, it returns to normal.
如果我删除它,它会恢复正常。
Screenshot when I don't add the sidebar Screenshot when I added the sidebar不添加侧边栏时的截图添加侧边栏时的屏幕截图
home.component.html home.component.html
<nb-layout windowMode>
<nb-layout-header fixed>
<nb-form-field>
<nb-icon nbPrefix icon="search-outline"></nb-icon>
<input type="text" nbInput fullWidth shape="round" placeholder="Search">
</nb-form-field>
<button nbButton outline shape="round" size="medium" status="primary"><nb-icon icon="plus-outline"></nb-icon>Upload</button>
<nb-actions>
<nb-action title="Messages" icon="message-circle-outline" badgeDot badgePosition="top right" badgeStatus="danger"></nb-action>
<nb-action title="Notifications" icon="bell-outline" badgeDot badgePosition="top right" badgeStatus="danger"></nb-action>
</nb-actions>
<nb-user size="medium" name="Tzuyu Chou" picture="https://i.pinimg.com/originals/98/98/c6/9898c6313b8270b8dcc4269c47c3ef9a.jpg"></nb-user>
</nb-layout-header>
<nb-sidebar></nb-sidebar>
<nb-layout-column>Content</nb-layout-column>
</nb-layout>
home.module.ts主页.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HomeComponent } from './home.component';
import { NbActionsModule, NbButtonModule, NbContextMenuModule, NbFormFieldModule, NbIconModule, NbInputModule, NbLayoutModule, NbMenuModule, NbSearchModule, NbSidebarModule, NbTabsetModule, NbUserModule } from '@nebular/theme';
import { RouterModule } from '@angular/router';
@NgModule({
declarations: [
HomeComponent
],
imports: [
CommonModule,
RouterModule,
NbLayoutModule,
NbActionsModule,
NbIconModule,
NbContextMenuModule,
NbTabsetModule,
NbButtonModule,
NbSearchModule,
NbUserModule,
NbFormFieldModule,
NbInputModule,
NbSidebarModule,
NbMenuModule,
]
})
export class HomeModule { }
I just want to add a sidebar to my project.我只想为我的项目添加一个侧边栏。 I follow the code in the documentation but still, it doesn't work.
我按照文档中的代码进行操作,但仍然无法正常工作。
Add NbSidebarService to the list of providers将 NbSidebarService 添加到提供者列表
@NgModule({
...
providers: [NbSidebarService],
...
})
export class AppModule {}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.