How to create a re-usable routerLink directive in Angular2

Question

I have a common route throughout my application, it is referenced like so:

<a [routerLink]="['/Project', {id: project.id, title: project.urlTitle}]" href="#">
  {{project.title}}
</a>

How can I make this logic re-usable using a directive or similar?

I.E Ideally I'd like to do something like:

<a [project-link]="project"></a>

Answer 1

Just create a component that contains the routerLink.