重载后角度2网址的变化

Question

我有角色queryParams和params应用程序中的网址.而且我遇到了问题:重新加载页面后我的网址被扭曲了.

用params:

http://127.0.0.1:8000/albums?user_id=1

重装后:

http://127.0.0.1:8000/albums/?user_id=1

用queryParams:

http://127.0.0.1:8000/albums/%3Aid;id=13

重装后:

http://127.0.0.1:8000/albums/%3Aid%3Bid%3D13

routes.ts

import { ModuleWithProviders }  from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { HomeComponent } from './components/home/home.component';
import { LoginComponent }  from './components/login/login.component';
import { RegisterComponent }  from './components/register/register.component';
import { AlbumsComponent }  from './components/albums/albums.component';
import { AddAlbumComponent }  from './components/albums/add-album.component';
import { AddImageAlbumComponent }  from './components/albums/add-image-album.component';
import { AlbumDetailComponent }  from './components/albums/album-detail.component';
import { PhotosComponent }  from './components/photos/photos.component';
import { UsersComponent }  from './components/users/users.component';
import { AuthGuard } from './guards/auth.guard'

const appRoutes: Routes = [
    { path: '', component: HomeComponent },
    { path: 'login', component: LoginComponent },
    { path: 'register', component: RegisterComponent },
    { path: 'albums', component: AlbumsComponent, canActivate: [AuthGuard] },
    { path: 'add-album', component: AddAlbumComponent, canActivate: [AuthGuard] },
    { path: 'add-image-album/:id', component: AddImageAlbumComponent, canActivate: [AuthGuard] },
    { path: 'albums/:id', component: AlbumDetailComponent, canActivate: [AuthGuard] },
    { path: 'photos', component : PhotosComponent, canActivate: [AuthGuard] },
    { path: 'users', component : UsersComponent, canActivate: [AuthGuard] }
];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

导航params:

[routerLink]="['/albums/:id', {id: album.id}]

导航queryParams:

[queryParams]="{user_id: dataService.getCurrentUserId()}"

Answer 1

对重新加载的 queryparams url 进行 url 解码后，我得到以下结果：

http://127.0.0.1:8000/albums/:id;id=13

它本质上与您的原始 url 相同，但参数完全经过 url 编码。

更新：

如果您需要有关如何强制解码 url 的参考，您可以查看之前的堆栈溢出问题