Question

这是一个例子。当我单击“注销”按钮时，它会使用查询参数message=loggedout重定向到根路径。当我点击“登录”按钮，然后重定向到登录路径时，message=loggedout参数仍然存在 - 即：/signin?message=loggedout

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>

Answer 1

查询参数需要明确重置。

这可能有效：

[queryParams]="{}">

另见https://github.com/angular/angular/issues/9573#issuecomment-228568695

Answer 2

对于当前版本的Angular（RC.4），请参阅Günter的解决方案/答案。

在Angular的下一个版本中，这应该是固定的 - 即，导航到新URL时查询参数不会保留。

请参阅https://github.com/angular/angular/issues/9924#issuecomment-231454941

切换到新URL时，Angular 2查询参数保持不变

2 个答案: