0

I am using ng-repeat to create a list of videos. I need to set rel attribute of image in each row. I am trying in following way:

<li ng-repeat="video in top_videos >
    <div class=" video-list" >   
    <a href="#">   
        <img src="images/aspect-px.png" rel="{{video.video_image}}" /></a>
        <h3><a href="post.html">{{video.name}}</a></h3>                                               
    </div>   
</li>

It is binding the video.name in h3 tag but not binding rel with video.video_image value. Instead of video.video_image's value, it is binding it as a string i.e http://localhost:9000/%7B%7Bvideo.video_identifier%7D%7D. My video.video_image has valid image urls like http://my-cdn-server/vaild-image.jpg.

I have lot's of theme related jQuery methods, which need a valid rel value. Please help me to make it work.

Marc Dix
  • 1,864
  • 15
  • 29
Harpreet Gill
  • 138
  • 2
  • 10
  • Possible duplicate of [How to generate url encoded anchor links with AngularJS?](http://stackoverflow.com/questions/14512583/how-to-generate-url-encoded-anchor-links-with-angularjs) – DrColossos Jun 01 '16 at 08:53

1 Answers1

0

There is a really good read on understanding the scopes at AngularJS give it a look even if this is not the cause it will give you a great understanding on basic concepts:

https://github.com/angular/angular.js/wiki/Understanding-Scopes

or just watch the video (3 min)

https://www.youtube.com/watch?v=ZhfUv0spHCY&feature=youtu.be&t=30m

What I believe the issue is: top_videos is a plain variable usually this causes troubles when accessing an object inner attributes when using angular 2 way binding, the general recommendation is that there should be an additional level (topLevel.your object):

<li ng-repeat="video in data.top_videos >
    <div class=" video-list" >   
    <a href="#">   
        <img src="images/aspect-px.png" rel="{{video.video_image}}" /></a>
        <h3><a href="post.html">{{video.name}}</a></h3>                                               
    </div>   
</li>

Obviously that additional level should be added everywhere where you are using your variable

Richard
  • 640
  • 7
  • 13