angularjs - Angular JS - 使用 ng-repeat 动态地将 href 链接添加到图标

Question

我正在尝试使用 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",
    "tags": "tag"
  },     

  ];

}

Answer 1

您可以在 ng-repeat 中放置一个带有动态 href 的 标记，它的工作原理与您预期的一样 - 尽管使用 ng-href 更好，因此您的链接在数据绑定(bind)准备好之前不会中断。

我更新了你的 fiddle :here

所以 ng-repeat 开始于:

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

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