title: caching images in angularjs - ngRepeat
body: <p>I wanted to know how to implement a image cache in AngularJS, or a way to load the image once and use it many times in the same application</p>
  
  <p>I have to show a directory listing in <a href="https://github.com/angular-ui/ui-select" rel="nofollow">ui-select</a> . The drop down may contain folders or files. For folders I want to show a folder icon and for files I want to show a file icon. I am using ng-repeat to iterate the array of files and folders</p>
  
  <pre><code>[ {name: "abc/", folder: true}, {name: "pqr.txt", folder: false}, ......]
  </code></pre>
  
  <p>Inside the ng-repeat, I have a ng-if which shows a folder icon, if folder-attribute is true else it shows a file-icon. Right now, I am using  tag to load the image. The image is in my local directory, will it slow down the performance? Should I use a cache? </p>