title: Angular 4 add URL to innerhtml
body: <p>I'm using angular 4 innerHtml element for parsing Html from the server.</p>
  
  <pre><code>  &lt;div *ngFor="let html of htmlToRender"&gt;
      &lt;div [innerHtml]="html"&gt;&lt;/div&gt;
       &lt;/div&gt;
  </code></pre>
  
  <p>I'm using API to get HTML from the server and the response I'm using JSON.parse() method to parse the response type. 
  it gives me the array</p>
  
  <pre><code>   this.htmlToRender = JSON.parse(this.htmlToParse._body);
  </code></pre>
  
  <p>now the problem is when i'm rendering <strong>this.htmltoRender</strong> i may get some image or file URls which are having absolute path.
  eg:</p>
  
  <pre><code>&lt;img alt="" src="/Source/ImageBrowser/Image?path=logoCar.qd.png"
  </code></pre>
  
  <p>from the server, I will get such path... I need to add Url to access that source example: for the response, I need to append example "<a href="http://google.com" rel="nofollow noreferrer">http://google.com</a>"
  ie.,. </p>
  
  <pre><code>&lt;img alt="" src="http://google.com/Analytics/ImageBrowser/Image?path=logo.qd.png"&gt;
  </code></pre>
  
  <p>since parsing from the server they are not able to append 
  so any idea how we can achieve this in angular 4?</p>