title: Clickable url value in ag-grid with react
body: <p>I'm currently giving <a href="https://www.ag-grid.com/" rel="noreferrer"><code>ag-grid</code></a> a try and trying to build a table where if the user clicks a column value, they are taken to a page containing that entry's details.</p>
  
  <p><strong>How can I make a cell value clickable in ag-grid?</strong></p>
  
  <p>I've tried using <code>valueGetter: this.urlValueGetter</code> with <code>columnDefs</code> and:</p>
  
  <pre><code>urlValueGetter(params) {
    return '&lt;a href=\'bill/' + params.data.id + '\'&gt;details&lt;/a&gt;';
  }
  </code></pre>
  
  <p>but it now looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/6EjT8.png" rel="noreferrer"><img src="https://i.stack.imgur.com/6EjT8.png" alt="enter image description here"></a></p>
  
  <p>I then tried using <code>template: '&lt;a href=\'bill/{id}\'&gt;details&lt;/a&gt;'</code> which does show the cell text as clickable but the id is not replaced. I assume this could work if I could somehow pass in the id?</p>
  
  <p><a href="https://i.stack.imgur.com/5nKE4.png" rel="noreferrer"><img src="https://i.stack.imgur.com/5nKE4.png" alt="enter image description here"></a></p>