web-dev-qa-db-ja.com

routerLinkを使用して戻る

RouterLinkを使用してページに戻ります。

現在のルートには3つのレベルがあります。

myurl.com/parent
myurl.com/parent/child
myurl.com/parent/child/grandchild

また、私はいくつかの異なるコンポーネントを持っているので、常に親になるとは限りません。たとえば、子供と孫の場合は、parent1またはparent2になる可能性があります。次に例を示します。

myurl.com/parent2/child1/grandchild2

私が欲しいのは常に前のレベルに行くことです、例えば:

myurl.com/parent/child/grandchild -> myurl.com/parent/grandchild

私がしたことは:

<button [routerLink]="['../'']">
       back
</button>

しかし、常に「myurl.com」に移動します

どうすれば解決できますか?

一部のユーザーが示唆したように、私はルーティング構成を共有しています:

app.routing.ts:

const APP_ROUTES: Routes = [
{
  path: '',
  canActivate: [LoggedInGuard],
  children: [
    {path: '', redirectTo: '/mainPage', pathMatch: 'full'},
    {path: 'parent', loadChildren: 'app/parent/parend.module#ParentModule'
]},
{path: '**', redirectTo: ''}
];

parent.routing.ts:

const PARENT_ROUTES: Routes = [
 {path: '', component: ParentComponent},
 {path: ':id', component: ChildComponent},
];

ブラウザで私が書いた場合:

myurl.com/parent -> it works

しかし、戻るボタンをクリックすると失敗します

4
cucuru

「上」に1レベル上に移動しようとしている場合は、ほぼ正しいです。

<a routerLink="..">Up</a>

これはナビゲートします

myurl.com/parent/child/grandchild -> myurl.com/parent/child

ただし、ブラウザの「戻る」ボタンのように本当に「戻る」には、JavaScriptを使用する必要があります。

その問題にはさまざまな既存の回答があります このStackOverflowの質問について


より複雑なことについては、何をしようとしているのかによりますが、クリックハンドラーとURLの手動操作が必要になる可能性があります。

13
Vlad274