У меня есть угловая директива, которая отображает изображение на моей странице. Однако это изображение определяется значением в запросе в URL-адресе:
app.directive('myDirective', function(myService) {
return {
restrict: 'A',
replace: true,
scope: true,
link: function($scope, element, attrs) {
var myImage = myService.getParam();
if (myImage == AA3) {
$scope.myImage = 'YAHOO';
}
else {
$scope.myImage = 'capitalone';
}
},
template : '<img src="/resources/{{myImage}}.png" />'
};
});
Проблема с вышесказанным заключается в том, что я могу видеть 2 http-запроса:
1. http://www.mydom.net/resources/{{myImage}}.png
2. http://www.mydom.net/resources/YAHOO.png
Как я могу отложить компиляцию шаблона, пока myImage не будет содержать значение?
ng-src
должен сделать трюк ~~
template: '<img ng-src="/resources/{{myImage}}.png"/>'
используйте ng-src вместо src.
<img ng-src="/resources/{{myImage}}.png" />
Используйте ng-src вместо src
template : '<img ng-src="/resources/{{myImage}}.png" />'
ng-src
вместоsrc
в вашем тегеimg
.