У Angular нет экспортируемого члена 'SpecialComponent'

Question

Я получаю ошибку в приложении, как описано ниже.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';

import { AppComponent } from './app.component';
import { RegisterComponent } from './register/register.component';
import { LoginComponent } from './login/login.component';
import { EventsComponent } from './events/events.component';
import { SpecialComponent } from './special/special.component';
import { AuthService } from './auth.service';
import { EventService } from './event.service';
import { ContactComponent } from './contact/contact.component';

@NgModule({
  declarations: [
    AppComponent,
    RegisterComponent,
    LoginComponent,
    EventsComponent,
    SpecialComponent,
    ContactComponent

  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    AppRoutingModule

  ],
  providers: [AuthService,EventService],
  bootstrap: [AppComponent]
})
export class AppModule { }

ОШИБКА в src / app / app-routing.module.ts (4,10): ошибка TS2305: Модуль 'C: / Users / dstnh / Desktop / systemalarm / ngApP /У src / app / special / special.component "" нет экспортированного члена SpecialComponent.src / app / app.module.ts (11,10): ошибка TS2305: модуль "C: /Users/dstnh/Desktop/systemalarm/ngApP/src/app/special/special.component" "не имеет экспортированного члена"SpecialComponent.i ｢wdm｣: не удалось скомпилировать.

Answer 1

Отредактируйте app module таким образом

    import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';

import { AppComponent } from './app.component';
import { RegisterComponent } from './register/register.component';
import { LoginComponent } from './login/login.component';
import { EventsComponent } from './events/events.component';
import { AuthService } from './auth.service';
import { EventService } from './event.service';
import { ContactComponent } from './contact/contact.component';

@NgModule({
  declarations: [
    AppComponent,
    RegisterComponent,
    LoginComponent,
    EventsComponent,
    ContactComponent

  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    AppRoutingModule

  ],
  providers: [AuthService,EventService],
  bootstrap: [AppComponent]
})
export class AppModule { }

и app routing следующим образом:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { EventsComponent } from './events/events.component';
import { LoginComponent } from './login/login.component';
import { RegisterComponent } from './register/register.component';

const routes: Routes = [
  {
    path: '',
    redirectTo:'/events',
    pathMatch:'full'
  },
  {
    path: 'events',
    component: EventsComponent
  },
  {
    path:'login',
    component:LoginComponent
  },
  {
    path:'register',
    component:RegisterComponent
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Так что в основном удалите ссылки SpecialComponent, и это будет работать снова

Answer 2

    import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { EventsComponent } from './events/events.component';
import { SpecialComponent } from './special/special.component';
import { LoginComponent } from './login/login.component';
import { RegisterComponent } from './register/register.component';

const routes: Routes = [
  {
    path: '',
    redirectTo:'/events',
    pathMatch:'full'
  },
  {
    path: 'events',
    component: EventsComponent
  },
  {
    path:'special',
    component: SpecialComponent
  },
  {
    path:'login',
    component:LoginComponent
  },
  {
    path:'register',
    component:RegisterComponent
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }