Я использую маршрутизатор angular2 для настройки маршрутизации для моего приложения. Вот мой фрагмент кода.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { AppComponent } from './app.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { UpdateprofileComponent } from './updateprofile/updateprofile.component';
import { ChangepasswordComponent } from './changepassword/changepassword.component';
import { CookieService } from 'angular2-cookie/services/cookies.service';
import { PathLocationStrategy, LocationStrategy, HashLocationStrategy } from '@angular/common';
const routes = [
{
path: 'dashboard',
component: DashboardComponent
},
{ path: 'updateprofile', component: UpdateprofileComponent },
{ path: 'changepassword', component: ChangepasswordComponent },
// Not found
{ path: '**', redirectTo: 'dashboard' }
];
@NgModule({
declarations: [
AppComponent,
DashboardComponent,
UpdateprofileComponent,
ChangepasswordComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
NgbModule.forRoot(),
RouterModule.forRoot(routes, { useHash: true })
],
providers: [CookieService],
bootstrap: [AppComponent]
})
export class AppModule { }
header.component.html
<header>
<select [(ngModel)]="userOperationType" (ngModelChange)="fnSetOperationType(userOperationType)" class="col-md-12 select-style">
<option value="dashboard">Account Administration</option>
<option value="changepassword" selected>Change Password</option>
<option value="updateprofile">Your Profile</option>
</select>
</header>
header.component.ts
import { Component, OnInit,Input } from '@angular/core';
import { UserDetailsService } from '../services/user-details.service';
import { Router } from '@angular/router';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss'],
providers: [UserDetailsService]
})
export class NvidiaHeaderComponent implements OnInit {
constructor() { }
fnSetOperationType(routeName) {
this.route.navigate([routeName]);
}
}
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Angular2Routing</title>
<base href="./">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root>loading...
</app-root>
<script type = "text/javascript" >
history.pushState(null, null, '/#/dashboard');
window.addEventListener('popstate', function(event) {
history.pushState(null, null, '/#/dashboard');
});
</script>
</body>
</html>
Это моя маршрутизация в app.module.ts. После перехода к маршруту смены пароля мой URL-адрес - http://localhost:4200/#/changepassword. Когда я обновляю свою страницу или открываю этот URL-адрес в новой вкладке, мой URL-адрес перенаправляется на http://localhost:4200/#/dashboard (маршрут по умолчанию).
Мне нужно получить тот же маршрут после обновления моей страницы, или если я скопирую и вставлю маршрут в другую вкладку, мне нужно получить соответствующий маршрут.
Помогите, пожалуйста. Заранее спасибо.
