CODEWITHSUNDEEP
angular
DEVLOGIN
DEVLOGIN

Reputation: 87

Angular route blank page

FIXED: We have to add into app.module.ts -> declarations: [WelcomeComponent,DashboardComponent ]

I want to make a route in Angular ,I have make a file app.routes.ts with this following code

import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {WelcomeComponent} from './welcome/welcome.component';
import {DashboardComponent} from './dashboard/dashboard.component';
import { ModuleWithProviders } from '@angular/core'





const routes: Routes = [
  {path: 'welcome', component: WelcomeComponent},
  {path: 'dashboard', component: DashboardComponent}
];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes)


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

}

But if I open my localhost or localhost/welcome or /dashboard , I got a blank page. Thanks

EDIT : This is my app.modules.ts file

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

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

import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MaterialModule} from './material.module';
import {FlexLayoutModule} from '@angular/flex-layout';

import {AppRouters} from './app.routes';


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

Upvotes: 0

Views: 1005

Answers (1)

Marco Wagner
Marco Wagner

Reputation: 479

You need to declare the components in your app.modules.ts:

@NgModule({
  declarations: [
    AppComponent,
    WelcomeComponent,
    DashboardComponent
  ],

  ...

})
export class AppModule { }

Upvotes: 1

Related Questions