title: Angular 2 dynamically set routerLink using a component property
body: <p>I have created an component that contains a  element with a routerLink property which I want to set from a template that uses the component. When I try to do this I get the error message 'Cannot read property 'path' of undefined'.</p>
  
  <p>My component looks link this:</p>
  
  <p>info-box.component.ts</p>
  
  <pre><code>import { Input, Component } from "@angular/core";
  import { ROUTER_DIRECTIVES } from "@angular/router";
  
  @Component({
      selector: "info-box",
      template: require("./info-box.component.html"),
      directives: [
          ROUTER_DIRECTIVES
      ]
  })
  
  export class InfoBoxComponent {
      @Input() routerLink: string;
      @Input() imageUrl: string;
  }
  </code></pre>
  
  <p>info-box.component.html</p>
  
  <pre><code>&lt;a [routerLink]="[routerLink]"&gt; 
      &lt;img src="{{imageUrl}}" width="304" height="236"&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>And and the template where the component is used it looks like this:</p>
  
  <pre><code>&lt;info-box [routerLink]="['/test']" [imageUrl]="['./testimage.jpg']"
  </code></pre>
  
  <p>If I do not add the routerLink everything works fine. My router config als seems to be right because when I add the  directly to my template it also works fine. Can anyone help me with this?</p>
  
  <p>Grt Marco</p>