title: Routing variable in Angular2
body: <p>I've read over the documentation for the new Angular router. The example they have for routing to a variable is this:</p>
  
  <p>Component/Module:</p>
  
  <pre><code>angular.module('myApp', ['ngFuturisticRouter'])
  .controller('AppController', ['$router', function($router) {
    $router.config({ path: '/user/:id' component: 'user' });
    this.user = { name: 'Brian', id: 123 };
  });
  </code></pre>
  
  <p>HTML/Template:</p>
  
  <pre><code>&lt;div ng-controller="AppController as app"&gt;
    &lt;a router-link="user({id: app.user.id})"&gt;{{app.user.name}}&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is my component:</p>
  
  <pre><code>@RouteConfig([
    { path: '/', component: Home, as: 'home' },
    { path: '/displays/:id', component: DisplayDetails, as: 'display-details' }
  ])
  </code></pre>
  
  <p>And my HTML/Template:</p>
  
  <pre><code>&lt;div class="col-md-3" *ng-for="#display of displays"&gt;
      &lt;a [router-link]="['/display-details({id: display.id})']"&gt;&lt;display-card &gt;&lt;/display-card&gt;&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I've also tried instead of putting the component alias <code>(display-details)</code> I've tried putting the actual path and the component it self but they all give me the same error:</p>
  
  <pre><code>EXCEPTION: Component "App" has no route named "display-details({id: display.id})". in [null]
  </code></pre>