title: go back using routerLink
body: <p>I'm using routerLink to go back in my page.</p>
  
  <p>Current route can have 3 levels:</p>
  
  <pre><code>myurl.com/parent
  myurl.com/parent/child
  myurl.com/parent/child/grandchild
  </code></pre>
  
  <p>also, I have some differents components, so it won't be always parent, it can be parent1, or parent2, also for child and grandchild, for example:</p>
  
  <pre><code>myurl.com/parent2/child1/grandchild2
  </code></pre>
  
  <p>what I want is always go to the previous level, for example:</p>
  
  <pre><code>myurl.com/parent/child/grandchild -&gt; myurl.com/parent/grandchild
  </code></pre>
  
  <p>what I did is:</p>
  
  <pre><code>&lt;button [routerLink]="['../'']"&gt;
         back
  &lt;/button&gt;
  </code></pre>
  
  <p>but it always navigate to "myurl.com"</p>
  
  <p>how can I solve it?</p>
  
  <p>As some users suggested, I'm sharing my routing configuration:</p>
  
  <p>in app.routing.ts:</p>
  
  <pre><code>const APP_ROUTES: Routes = [
  {
    path: '',
    canActivate: [LoggedInGuard],
    children: [
      {path: '', redirectTo: '/mainPage', pathMatch: 'full'},
      {path: 'parent', loadChildren: 'app/parent/parend.module#ParentModule'
  ]},
  {path: '**', redirectTo: ''}
  ];
  </code></pre>
  
  <p>in parent.routing.ts:</p>
  
  <pre><code>const PARENT_ROUTES: Routes = [
   {path: '', component: ParentComponent},
   {path: ':id', component: ChildComponent},
  ];
  </code></pre>
  
  <p>if in the browser I wrote:</p>
  
  <pre><code>myurl.com/parent -&gt; it works
  </code></pre>
  
  <p>but clicking the back button fails</p>