Angular7 Пустая страница появляется всякий раз, когда путь к маршруту и ​​объявление компонента происходят в app-rout.module.ts - PullRequest
Новая
       10

Angular7 Пустая страница появляется всякий раз, когда путь к маршруту и ​​объявление компонента происходят в app-rout.module.ts

0 голосов
/ 07 февраля 2019

Я настраиваю новое угловое приложение, и всякий раз, когда я указываю свои маршруты в файле app-routing.module.ts, страница отображается пустым. 

const routes: Routes = [
  {path: '/dashboard', component: DashboardComponent},
  {path: '/login', component: LoginComponent},
];

Однако, если я закомментирую это, оно будет отображаться правильно. 

const routes: Routes = [
  // {path: '/dashboard', component: DashboardComponent},
  // {path: '/login', component: LoginComponent},
];

Мой app-routing.moduel.ts Файл 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { UserProfileComponent } from './user-profile/user-profile.component';
import { RegisterComponent } from './register/register.component';


const routes: Routes = [
  {path: '/dashboard', component: DashboardComponent},
  {path: '/login', component: LoginComponent},
];

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

export const appRouteComponents = [
  LoginComponent,
  DashboardComponent,
  UserProfileComponent,
  RegisterComponent
];

Я уже импортировал appRouteComponents в файл app.module.ts

Это app.module.ts file 

import { MaterialDesignModule } from './material';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

import { AppRoutingModule, appRouteComponents } from './app-routing.module';
import { AppComponent } from './app.component';


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

1 Ответ

0 голосов
/ 07 февраля 2019

Попробуйте удалить / в маршрутах, как показано ниже. 

const routes: Routes = [
  { path: 'dashboard', component: DashboardComponent },
  { path: 'login', component: LoginComponent },
];
...