angularjs – Angular JS – 使用ng-repeat动态添加图标的href链

发布时间：2020-12-17 07:32:13 所属栏目：安全来源：网络整理

导读：我正在尝试使用angular来创建一个由主题,日期,演示者组织的不同视频的表格,并且还会被标记. 我使用ng-repeat重复我的对象数组来生成一个表. 但是,如何动态更改播放按钮的href链接？在下面的jsfiddle中,我添加了一个静态行,每行应该是什么样子.第一列有一个

我正在尝试使用angular来创建一个由主题,日期,演示者组织的不同视频的表格,并且还会被标记.

我使用ng-repeat重复我的对象数组来生成一个表.

但是,如何动态更改播放按钮的href链接？

在下面的jsfiddle中,我添加了一个静态行,每行应该是什么样子.第一列有一个链接到视频的fontawesome图标.如何编辑函数以便在ng-repeat中更新href链接？

http://jsfiddle.net/jheimpel/f139z9zx/3/

function playerCtrl($scope) {

  $scope.topics = [
   {
    "play": "play","topic": "topic 1","date": "date 1","presenter": "presenter 1","tags": "tag"
  },{
    "play": "play","topic": "topic 2","date": "date 2","presenter": "presenter 2",];

}

你可以放一个< a>在ng-repeat内部使用动态href进行标记,它的工作方式与您期望的一样 – 尽管使用ng-href更好,因此您的链接在数据绑定准备好之前不会中断.

我更新了你的小提琴：here

因此ng-repeat开头于：

<tr ng-repeat="topic in topics">
        <td><a ng-href="#/{{topic.url}}"><i class="fa fa-play"></i></a></td>

(我在测试数据中添加了额外的url字段)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!