title: arrow d3 graph svg not rendering
body: <p>I have been scratching my head for a long time on this... I have an SVG that is rendering nodes and links for a directed graph. However, the lines are not showing arrows. </p>
  
  <p>Here is the code snippet for the arrow that I am struggling with. The nodes and lines with the color all render, just not the arrow. I made this work on javascript without a problem but using Angular is not working. I can paste the Link class and the CSS if needed, let me know. </p>
  
  <pre><code>import { Component, Input } from '@angular/core';
  import { Link } from '../../../d3';
  
  @Component({
    selector: '[linkVisual]',
    template: `
  &lt;svg&gt;
    &lt;defs&gt;
      &lt;marker id="arrow" viewBox="0 -5 10 10" refX="8" refY="0" markerWidth="4" markerHeight="4" orient="auto"&gt;
        &lt;path d="M0,-5L10,0L0,5" class="arrow-head" /&gt;
      &lt;/marker&gt;
    &lt;/defs&gt;
    &lt;line
        class="link"
        [attr.x1]="link.source.x"
        [attr.y1]="link.source.y"
        [attr.x2]="link.target.x"
        [attr.y2]="link.target.y"
        [attr.stroke]="link.color2"
        marker-end="url(#arrow)"
    &gt;
    &lt;/line&gt;
  &lt;/svg&gt;
    `,
    styleUrls: ['./link-visual.component.css']
  })
  export class LinkVisualComponent  {
    @Input('linkVisual') link: Link;
  }
  </code></pre>
  
  <p>The code that doesnt render (and doesnt error) is marker-end="url(#arrow)". I have also tried to change it to [attr.marker-end]="url(#arrow)" which actually errors out (it says it cannot find #arrow)...</p>