title: Use of ng-src vs src
body: <p>This <a href="https://code.angularjs.org/1.3.7/docs/tutorial/step_06" rel="noreferrer">tutorial</a> demonstrates the use of the directive <code>ngSrc</code> instead of <code>src</code> :</p>
  
  <pre><code>&lt;ul class="phones"&gt;
      &lt;li ng-repeat="phone in phones" class="thumbnail"&gt;
          &lt;img ng-src="{{phone.imageUrl}}"&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>They ask to:</p>
  
  <blockquote>
    <p>Replace the ng-src directive with a plain old src attribute. <br>
    Using tools such as Firebug, or Chrome's Web Inspector, or inspecting the
    webserver access logs, confirm that the app is indeed making an
    extraneous request to <strong>/app/%7B%7Bphone.imageUrl%7D%7D</strong> (or
    <strong>/app/{{phone.imageUrl}}</strong>).</p>
  </blockquote>
  
  <p>I did so and it gave me the correct result:</p>
  
  <pre><code>&lt;li class="thumbnail ng-scope" ng-repeat="phone in phones"&gt;
      &lt;img src="img/phones/motorola-xoom.0.jpg"&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>Is there a reason why?</p>