0

I see in console that my browser is making request to a link that does not exist as I have placed it in data-original of my image. But this is a malformed URL. Sample of this is given below:

http://localhost:8080/%7B%7Bobject.array[0].url%7D%7D

I have an <img src="" /> tag inside ng-repeat. I want my data-original attribute to be url encoded and also prevent javascript from making such calls where 

{{object.array[0].url}}

is given.

Sample code is given below:

<div ng-repeat="object in objects">
    <img src="constant.jpg" data-original="{{object.array[0].url}}" />
</div>

I cannot use ng-src here as the link of image given in src attribute will be constant here.

HVT7
  • 709
  • 4
  • 13
  • 23

1 Answers1

1

Try using ngAttr directive to bind your property

<img src="constant.jpg" ng-attr-data-original="{{object.array[0].url}}" />

This prevents anything seeing the attribute value before the binding happens

To escape the url you'll need something like in this answer.

Community
  • 1
  • 1
gyantasaurus
  • 447
  • 2
  • 9
  • Thanks. I will try this. But meanwhile I have tried using `angular.module('myApp').directive();` and this helped me a lot. I have found solution to my problem, But will mark this as an answer if it fits the query. – HVT7 May 20 '15 at 05:15