首页 > 解决方案 > 使用 ng 闪电遇到的角度错误

问题描述

我正在尝试使用 Angular 12 开始使用 ng 闪电框架按照以下链接中的步骤进行操作

https://ng-lightning.github.io/ng-lightning/#/get-started

使用以下安装 ng 闪电

npm install --save ng-lightning

还安装了@angular/cdk

npm install --save @angular/cdk

我的 app.module.ts 如下,添加了 'NglModule'

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

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import {NglModule} from 'ng-lightning';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
     NglModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.html 如下

<button type="button" nglButton variant="brand">brand</button>



<ngl-combobox label="Make a choice" [options]="options" [(open)]="open" [(selection)]="selection">
  <input nglCombobox placeholder="Select an Option">
</ngl-combobox>


ts文件如下

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'demo-app2';
  options = ['One', 'Two', 'Three'];

  selection: string = "";

  open = false;
}

当我使用 ng serve 运行时,出现此错误

PS C:\SudhirLearning\Angular\projects\demo-app2> ng serve    
⠋ Generating browser application bundles (phase: setup)...C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\entry_point_finder\targeted_entry_point_finder.js:40
                throw new Error("The target entry-point \"" + invalidTarget.entryPoint.name + "\" has missing dependencies:\n" +
                ^

Error: The target entry-point "ng-lightning" has missing dependencies:
 - @angular/core
 - @angular/common
 - rxjs
 - rxjs/operators
 - @angular/forms

    at TargetedEntryPointFinder.findEntryPoints (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\entry_point_finder\targeted_entry_point_finder.js:40:23)
    at C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\execution\analyze_entry_points.js:29:41
    at SingleProcessExecutorSync.SingleProcessorExecutorBase.doExecute (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:28:29)
    at C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:57:59        
    at SyncLocker.lock (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\locking\sync_locker.js:34:24)    
    at SingleProcessExecutorSync.execute (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:57:27)
    at Object.mainNgcc (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\src\main.js:74:25)
    at Object.process (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@angular\compiler-cli\ngcc\index.js:29:23)
    at NgccProcessor.processModule (C:\SudhirLearning\Angular\projects\demo-app2\node_modules\@ngtools\webpack\src\ngcc_processor.js:175:16)      
    at C:\Sudhir

标签: angular

解决方案


推荐阅读