Импортирована неожиданная директива модуля входа в Angular Routing [ОШИБКА] - PullRequest
Новая
       36

Импортирована неожиданная директива модуля входа в Angular Routing [ОШИБКА]

0 голосов
/ 05 июля 2019

У меня именно эта ошибка; 

Unexpected directive 'LoginComponent' imported by the module 'AppModule'. Please add a @NgModule annotation.

Кто-нибудь знает, для чего она?мой app-routing.module таков: 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './components/login/login.component';

const routes: Routes = [
  {
    path: 'login',
    loadChildren: './components/login/login.component#LoginModule'
  }
];

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

, а app.module - 

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    LayoutModule,
    OverlayModule,
    HttpClientModule,
    LoginComponent,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: createTranslateLoader,
        deps: [HttpClient]
      }
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})

мой login.component 

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

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.scss']
})

export class LoginComponent implements OnInit {
  constructor(private router: Router) { }

  ngOnInit() { }

  onLogin() {
    localStorage.setItem('isLoggedin', 'true');
    this.router.navigate(['/dashboard']);
  }
}

где гореименно так?Кто-нибудь может дать мне подсказку в правильном направлении?AppModule содержит мой LoginComponent внутри секции imports, как и ожидалось.Тогда почему выше ошибка?Не могли бы вы объяснить?Ожидается, что мое приложение загрузит страницу входа при запуске, т.е.localhost:4200 должен в основном загружать логин так же, как и localhost:4200/login.

Мне не очень понятно, что я тут неправильно сделал логически!

1 Ответ

1 голос
/ 05 июля 2019

удалить LoginComponent из imports и добавить его в declarations

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    LayoutModule,
    OverlayModule,
    HttpClientModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: createTranslateLoader,
        deps: [HttpClient]
      }
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})

imports используется для импорта других модулей и делает их функциональные возможности доступными для текущего модуля. компоненты не импортируются в модуль в угловых, модули есть. компоненты объявлены как часть модуля.

...