Question

我正在使用ng-repeat来制作视频列表。我需要在每一行中设置图像的rel属性。我正在尝试以下方式：

<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>

它绑定h3标记中的video.name但不绑定rel video.video_image值。它不是video.video_image的值，而是将其绑定为字符串，即http://localhost:9000/%7B%7Bvideo.video_identifier%7D%7D。我的video.video_image包含有效的图片网址，例如http://my-cdn-server/vaild-image.jpg。

我有许多与主题相关的jQuery方法，它们需要有效的rel值。请帮我把它搞定。

Answer 1

有一个很好的阅读理解AngularJS的范围，即使这不是原因，它会让你对基本概念有一个很好的理解：

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

或只是观看视频（3分钟）

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

我认为问题是：top_videos是一个普通变量，通常这会在使用angular 2 way绑定时访问对象内部属性时出现问题，一般建议应该有一个额外的级别（topLevel.your对象）：

<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>

显然，在使用变量的任何地方都应添加额外的级别

AngularJS rel属性绑定

1 个答案: