为什么我的nb搜索未出现在我的页面中?

时间:2019-05-24 16:37:30

标签: html angular nebular

我创建了一个带有导航栏的主页,因为我真的很喜欢它的设计,所以我打算将它放置在星云搜索中,但是由于某些原因,在跟随他们的instructions之后,我仍然无法使其显示。

<nb-layout>
<nb-layout-header fixed>
    <nb-search type="rotate-layout></nb-search>
</nb-layout-header>
</nb-layout>

1 个答案:

答案 0 :(得分:1)

最可能是您的问题的原因

https://github.com/akveo/nebular/issues/1275

您需要添加forEach"./node_modules/nebular-icons/scss/nebular-icons.scss"

这将显示搜索图标。

深入

我通过遵循入门教程https://akveo.github.io/nebular/docs/guides/install-based-on-starter-kit#production-bundle

设法使此工作正常进行

我决定使用他们网站上的html:

angular.json

棘手的事情是确保导入所有正确的模块: 我安装 <nb-layout> <nb-layout-header fixed> <nb-search type="rotate-layout"></nb-search> </nb-layout-header> <nb-sidebar> </nb-sidebar> <nb-layout-column> <nb-card accent="info"> <nb-card-header>You searched for:</nb-card-header> <nb-card-body> <h3>{{ value || '-' }}</h3> </nb-card-body> </nb-card> </nb-layout-column> </nb-layout>

时插入了NbThemeModule.forRoot({ name: 'default' }),
@nebula/themes

重新使用网站上的示例代码:

import {
  NbThemeModule,
  NbLayoutModule,
  NbCardModule,
  NbSidebarModule,
  NbSidebarService,
  NbSearchModule,
} from '@nebular/theme';

@NgModule({
  declarations: [
    AppComponent,
    TestComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    NbThemeModule.forRoot({ name: 'default' }),
    NbLayoutModule,
    NbCardModule,
    NbSidebarModule,
    NbSearchModule
  ],
  providers: [NbSidebarService],
  bootstrap: [AppComponent]
})
export class AppModule { }