... <ul class="phones"> <li ng-repeat="phone in $ctrl.phones | filter:$ctrl.query | orderBy:$ctrl.orderProp" class="thumbnail"> <a href="#/phones/{{phone.id}}" class="thumb"> <img ng-src="{{phone.imageUrl}}" alt="{{phone.name}}" /> </a> <a href="#/phones/{{phone.id}}">{{phone.name}}</a> <p>{{phone.snippet}}</p> </li> </ul> ...
We also added phone images next to each record using an image tag with the ngSrc directive. That directive prevents the browser
from treating the Angular {{ expression }} markup literally, and initiating a request to an invalid URL
為什麼不直接使用<img src="{{phone.imageUrl}}">因為浏覽器會請求{{phone.imageUrl}}這個url。