Javascript 在标记中插入变量时角度崩溃

我开始研究星云，现在我有点被卡住了

app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router';

import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HttpClientModule } from '@angular/common/http';

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

const routes: Routes = [
  { path: '', redirectTo: '/', pathMatch: 'full' },
];

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    RouterModule.forRoot(routes),
    HttpClientModule,
    NbThemeModule.forRoot(),
    NbLayoutModule,
    NbContextMenuModule,
    NbActionsModule,
    NbMenuModule,
    NbSidebarModule,
    NbCardModule,
  ],
  providers: [NbSidebarService],
  bootstrap: [AppComponent],
})

export class AppModule { }

我在AppComponent中创建了一个简单的UI：

    <nb-card>
      <nb-menu [items]="items">
      </nb-menu>
    </nb-card></nb-sidebar><nb-layout-column>
    <nb-layout-header fixed>
      <nb-actions class="left">
        <nb-action class="profile" nbContextMenuPlacement="bottom">Profile</nb-action>
        <nb-action>Settings</nb-action>
      </nb-actions>
    </nb-layout-header>
    <router-outlet></router-outlet>
    </nb-layout-column>
    </nb-layout>

插入item变量时，角度崩溃。如果没有变量，它可以正常工作

ERROR NullInjectorError: R3InjectorError(AppModule)[NbMenuInternalService -> NbMenuInternalService -> NbMenuInternalService]: 
  NullInjectorError: No provider for NbMenuInternalService!
    Angular 9
        get
        get
        get
        get
        get
        get
        lookupTokenUsingModuleInjector
        getOrCreateInjectable
        directiveInject
    NbMenuComponent_Factory index.js:11914
    Angular 5
        getNodeInjectable
        instantiateAllDirectives
        createDirectivesInstances
        elementStart
        element
    AppComponent_Template app.component.html:5
    Angular 20
        executeTemplate
        renderView
        renderComponent
        renderChildComponents
        renderView
        create
        bootstrap
        _moduleDoBootstrap
        _moduleDoBootstrap
        bootstrapModuleFactory
        invoke
        onInvoke
        invoke
        run
        scheduleResolveOrReject
        invokeTask
        onInvokeTask
        invokeTask
        runTask
        drainMicroTaskQueue

---

我什么也找不到，我真的很绝望。提前感谢。

您应该将NbMenuInternalService添加到应用程序模块中的提供商：

  providers: [NbSidebarService, NbMenuInternalService],

有关更多详细信息：您可以访问链接

另外，对NbMenuModule进行以下更改：

imports: [
    BrowserModule,
    BrowserAnimationsModule,
    RouterModule.forRoot(routes),
    HttpClientModule,
    NbThemeModule.forRoot(),
    NbLayoutModule,
    NbContextMenuModule,
    NbActionsModule,
    NbMenuModule.forRoot(), // change this line
    NbSidebarModule,
    NbCardModule,
  ],

---

您不能添加InternalService，但forRoot有效。谢谢=）

imports: [
    BrowserModule,
    BrowserAnimationsModule,
    RouterModule.forRoot(routes),
    HttpClientModule,
    NbThemeModule.forRoot(),
    NbLayoutModule,
    NbContextMenuModule,
    NbActionsModule,
    NbMenuModule.forRoot(), // change this line
    NbSidebarModule,
    NbCardModule,
  ],