title: how to do pipe to src attribute angular
body: <p>If I do: <code>&lt;h2&gt;{{event.role | lowercase}}&lt;/h2&gt;</code>. However, if I try to use it in an <code>src</code> attribute like this:</p>
  
  <pre><code>&lt;img src={{event.eventName | lowercase}} alt=""&gt;
  </code></pre>
  
  <p>I get the error:</p>
  
  <pre><code>core.js:6237 ERROR DOMException: 
  Failed to execute 'setAttribute' on 'Element': '|' is not a valid attribute name.
  </code></pre>
  
  <p>It is not recognizing the pipe, however, not using the pipe works correctly so the format <code>{{event.eventName}}</code> seams to work. How should I do it?</p>