Question

对于星云而言，新的东西是基于星云的任何其他DOCS。我已经尝试过在模块中插入组件我用SIDEBAR模块制作了SIDEBAR组件

App.module

current date

app.component.html

stored date

sidebar.module.ts

import { BrowserModule } from '@angular/platform-browser';<br>
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NbThemeModule, NbLayoutModule } from '@nebular/theme';
// import { SideBarComponent } from './side-bar/side-bar.component';
import { SideBarModule } from './side-bar/side-bar.module';

@NgModule({
  declarations: [
    AppComponent,
    // SideBarComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    NbThemeModule.forRoot({ name: 'cosmic' }),
    NbLayoutModule,
    SideBarModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

sidebar.comonent.ts

<nb-layout>

  <nb-layout-header fixed>
  <!-- Insert header here -->
  <a routerLink="/side-bar" routerLinkActive="active">SIDEBAR</a>

  </nb-layout-header>

  <nb-layout-column>

    <!--The content below is only a placeholder and can be replaced.-->


  </nb-layout-column>

  <nb-layout-footer fixed>
  <!-- Insert footer here -->
  </nb-layout-footer>

</nb-layout>

sidebar.html

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SideBarComponent } from './side-bar.component';
import { NbLayoutModule } from '@nebular/theme';
// import { SideBarService } from '../services/side-bar.service';



@NgModule({
  declarations: [SideBarComponent],
  imports: [
    CommonModule,
    NbLayoutModule,
  ]
})
export class SideBarModule { }

服务

import { Component, OnInit } from '@angular/core';
import {MatSidenavModule} from '@angular/material/sidenav';
import { NbSidebarService } from '@nebular/theme';

@Component({
  selector: 'app-side-bar',
  templateUrl: './side-bar.component.html',
  styleUrls: ['./side-bar.component.scss']
})
export class SideBarComponent implements OnInit {

  constructor(private sidebarService:NbSidebarService){}
ngOnInit(){

}
toggle() {
  this.sidebarService.toggle(true);
  return false;
}

  }

我希望将程序作为侧边栏

运行

如何修复

未捕获的错误：模板解析错误： 'nb-sidebar'不是一个已知元素： 1.如果“ nb-sidebar”是Angular组件，则请验证它是否是此模块的一部分。 2.如果“ nb-sidebar”是Web组件，则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schemas”以禁止显示此消息。（“

[错误->]

布局内容 ”）：ng：///SideBarModule/SideBarComponent.html@6：2

Answer 1

尝试将SideBarModule而不是sidebar.module.ts中的App.module导入

Answer 2

尝试

package.json

Answer 3

您还需要在AppModule和SideBarModule中导入NbSidebarModule

app.module.ts

import {NbSidebarModule} from '@nebular/theme'

@NgModule({
  //...
  imports: [
    //...
    SideBarModule,
    NbSidebarModule.forRoot() //<== add this
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

sidebar.module.ts

import {NbSidebarModule} from '@nebular/theme'

@NgModule({
  //..
  imports: [
    NbSidebarModule //<== add this
  ]
})
export class SideBarModule { }

如何解决未捕获的错误：模板解析错误：'nb-sidebar'不是一个已知元素：

3 个答案: