title: Angular routerLink appends route instead of replacing
body: <p>I have the following route configuration in my Angular app</p>
  <pre><code>...
  { path: 'item/new', component: ItemDetailsComponent, pathMatch: 'full', data: { new: true } },
  { path: 'item/:id/:action', component: ItemDetailsComponent, pathMatch: 'full' },
  ...
  </code></pre>
  <p>were <strong>:action</strong> can be either &quot;view&quot; or &quot;edit&quot;. All three possible paths do work when I enter them directly into the browser. However, the router links within the item-template do not:</p>
  <pre><code>&lt;div routerLink=&quot;['/item', id, 'edit']&quot;&gt;Test&lt;/div&gt;
  </code></pre>
  <p>&quot;id&quot; is set within the component, so thats likely not the problem. The browser console error indicates that the url is somehow appended:</p>
  <pre><code>ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'item/2/view/%5B'/item',%20id,%20'edit'%5D'
  Error: Cannot match any routes. URL Segment: 'item/2/view/%5B'/item',%20id,%20'edit'%5D'
  </code></pre>
  <p>Since the router link does start with a slash, I expected this to work.</p>