例を示します。 [ログアウト]ボタンをクリックすると、クエリパラメータmessage=loggedout
でルートパスにリダイレクトされます。私はその後、ボタン「サインイン」をクリックし、サインインパスにリダイレクトすると、message=loggedout
パラメータがまだそこにある - すなわち:/signin?message=loggedout
新しいURLに切り替えると、角2のクエリパラメータが残ります
App.component.ts
import { Component, OnInit } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';
import {AuthService} from '../../services/auth.service';
import { Router } from '@angular/router';
@Component({
moduleId: module.id,
selector: 'nav',
templateUrl: 'app.component.html',
directives: [ROUTER_DIRECTIVES],
providers: [AuthService]
})
export class AppComponent implements OnInit {
isLoggedIn = this._auth.isLoggedIn.check;
constructor(private _auth: AuthService, private _router: Router) {}
ngOnInit() {
}
logout() {
this._auth.logout()
.then(() => {
this._router.navigateByUrl('/?message=loggedout');
}
);
}
}
のApp .component.html
<nav>
<div class="nav-wrapper" style='background-color: #226784'>
<a class="brand-logo"[routerLink]="['/']">Site</a>
<ul class="right hide-on-med-and-down">
<li *ngIf="!isLoggedIn()"><a [routerLink]="['signin']" [queryParams]="">Sign In</a></li>
<li *ngIf="!isLoggedIn()"><a [routerLink]="['signup']" [queryParams]="">Sign Up</a></li>
<li *ngIf="isLoggedIn()"><a (click)="logout()">Logout</a></li>
</ul>
</div>
</nav>
<div class="container">
<router-outlet></router-outlet>
</div>