Angular 5 Not Navigating - angular5

Question

I'm using the route.navigate(['page']); conditionally and it does not work.
e.g
constructor(private route: Router){}
if(data.user != null) {
this.route.navigate(['page']);
} else {
alert('Please Login');
}
The URL changes but the page don't render.
This is my App Route Module
import { NgModule } from '#angular/core';
import { Routes, RouterModule } from '#angular/router';
// App Components
import { HeaderComponent } from './header/header.component';
import { HomeComponent } from './home/home.component';
import { ResultsListComponent } from './results-list/results-list.component';
import { SigninComponent } from './signin/signin.component';
import { AffordabilityComponent } from
'./affordability/affordability.component';
import { RegisterComponent } from './register/register.component';
import { ShowroomComponent } from './showroom/showroom.component';
import { AdminComponent } from './admin/admin.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { OffersComponent } from './offers/offers.component';
import { AdminHeaderComponent } from './admin-header/admin-
header.component';
import { FooterComponent } from './footer/footer.component';
import { DealerProfileComponent } from './dealer-profile/dealer-
profile.component';
const routes: Routes = [
{ path: '', component: HomeComponent },
// { path: '**', redirectTo: '', pathMatch: 'full' },
{ path: 'search_results', component: ResultsListComponent },
{ path: 'signin', component: SigninComponent },
{ path: 'results', component: AffordabilityComponent },
{ path: 'register', component: RegisterComponent },
{ path: 'showroom', component: ShowroomComponent },
{ path: 'admin', component: AdminComponent },
{ path: 'dashboard', component: DashboardComponent },
{ path: 'offers', component: OffersComponent },
{ path: 'profile', component: DealerProfileComponent }
];
#NgModule({
imports: [RouterModule.forRoot(routes, { enableTracing: true })],
exports: [RouterModule]
})
export class AppRoutingModule { }
export const routingComponents = [
HeaderComponent,
HomeComponent,
ResultsListComponent,
SigninComponent,
AffordabilityComponent,
RegisterComponent,
ShowroomComponent,
AdminComponent,
DashboardComponent,
OffersComponent,
AdminHeaderComponent,
FooterComponent,
DealerProfileComponent
];