title: Angular directive for icon format file
body: <p>I want to create an AngularJs directive that will allow me to display a specific icon (from a folder that contains a lot of different icon) for a specific file, for example:</p>
  
  <p>If <strong>myFile</strong> is an Html file we display <strong>icon_html.png</strong>, etc.</p>
  
  <p>I saw this <a href="https://stackoverflow.com/questions/23923260/angularjs-way-to-map-values-for-output-in-a-view#">answer</a> from Dayan Moreno Leon but he uses a CSS stylesheet to display the specific icon, I was searching something more generic.</p>
  
  <p>Any advice or recommendations are welcome :)</p>
  
  <p><strong>Update, I tried this</strong> :</p>
  
  <p>My directive :</p>
  
  <pre><code>myApp.directive("icon", function () {
  
  return {
      template: "&lt;img ng-src='style/icon/files_type_icons_flat/PNG/icon_{{icon}}.png'/&gt;",
      replace: false,
      scope:   true,
      compile: function (tElement, tAttrs) {
          // this is link function
          return function (scope) {
              scope.icon = tAttrs.icon;
          };            
      }
  };
  </code></pre>
  
  <p>});</p>
  
  <p>My view :</p>
  
  <pre><code>&lt;tr ng-repeat="row in entities" &gt;
      &lt;td&gt;
          &lt;div icon="{{row.extension}}"&gt;&lt;/div&gt; &amp;nbsp;{{row[col.title]}}.{{row.extension}}
      &lt;/td&gt;
  &lt;/tr&gt; 
  </code></pre>
  
  <p>Nothing worked :(</p>
  
  <p>Many thanks.</p>