出现在 AppModule 的 NgModule.imports 中，但无法解析为 NgModule 类

Question

Hi , I am getting the above issue. Please help me in solving how to fix this issue. I have tried as per this error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class . Restarted the server and also reinstalled the packages(npm install) but the error is still present.

my navbar.component.ts code

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

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})
export class NavbarComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }

}

my navbar.component.html code

<nav class="navbar navbar-expand-lg navbar-dark bg-danger">
  
    <a class="navbar-brand" routerLink="#"><B>hn</B></a>
    
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
      <div class="navbar-nav">
        <a class="nav-item nav-link active" routerLink="HOME">HOME  <span class="sr-only">(current)</span></a>
        <a class="nav-item nav-link active" routerLink="ABOUT">ABOUT  <span class="sr-only">(current)</span></a>
        <a class="nav-item nav-link active" routerLink="CONTACT">CONTACT  <span class="sr-only">(current)</span></a>
        <a class="nav-item nav-link active" routerLink="ADDRESS">ADDRESS <span class="sr-only">(current)</span></a>
      </div>
    </div>
  </nav>

app.module.ts code

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ChartsModule } from 'ng2-charts';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { RoutingModule } from './routing/routing.module';
import { MyPageComponent } from './my-page/my-page.component';
import { GridModule } from '@syncfusion/ej2-angular-grids';
import { NavbarComponent } from './navbar/navbar.component';
import {HttpClientModule} from '@angular/common/http';
import { DataService } from './dataservice';


@NgModule({
  declarations: [
    AppComponent,
    MyPageComponent,
    NavbarComponent,

  ],

  imports: [
    BrowserModule,FormsModule,ChartsModule,
    AppRoutingModule,
    RoutingModule,GridModule,NavbarComponent,HttpClientModule
  ],
  
  providers: [DataService],
  bootstrap: [AppComponent]
})
export class AppModule { }

mypage.component.ts code

import { Component, OnInit,ViewChild } from '@angular/core';
import { ChartDataSets, ChartOptions,ChartType } from 'chart.js';
import { Color, Label,SingleDataSet,monkeyPatchChartJsLegend,monkeyPatchChartJsTooltip } from 'ng2-charts';
import { DataService } from '../dataservice';
import { User } from '../User.module'; 
@Component({
  selector: 'app-my-page',
  templateUrl: './my-page.component.html',
  styleUrls: ['./my-page.component.css']
})
export class MyPageComponent implements OnInit {
public data: Object[];
  public lineChartData: ChartDataSets[] = [
    { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' },
  ];
  public lineChartLabels: Label[] = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
  public lineChartOptions: any = {
    responsive: true,
  };
  public lineChartColors: Color[] = [
    {
      borderColor: 'black',
      backgroundColor: 'maroon',
    },
  ];
  public lineChartLegend = true;
  public lineChartType = 'line';
  public lineChartPlugins = [];

}

Answer 1

NavbarComponent组件应该列在declarations ，而不是在imports 。