Angular JS - dynamicznie dodawaj linki href do ikon za pomocą polecenia ng-repeat

Question

Próbuję użyć kątowego, aby utworzyć tabelę z różnymi filmami, które są uporządkowane według tematu, daty, prezentera, a także są oznaczone.

Użyłem powtórzenia ng, aby powtórzyć nad moją tablicą obiektów, aby utworzyć tabelę.

Jak jednak mogę dynamicznie zmieniać link href do przycisku odtwarzania?

W jsfiddle poniżej dodałem statyczny wiersz tego, jak powinien wyglądać każdy. pierwsza kolumna ma fontawesome ikonę, która jest połączona z wideo. Jak mogę edytować tę funkcję, aby link href był aktualizowany w powtórzeniu ng?

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

Można położyć < się > tag z dynamicznym href wewnątrz NG-repeat, to działa tak, jak można się spodziewać - chociaż użycie ng-href jest lepsze, więc twoje linki nie pękają, zanim powiązania danych będą gotowe.

mam zaktualizowane skrzypce: here

Tak, że ng-repeat zaczyna:

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

(i dodałem, że dodatkowym url pola do danych testowych)

Answer 2

Jeśli ja zrozumiałem, wystarczy użyć NG-href:

<td><a ng-href="{{linkVar}}"><i class="fa fa-play"></i></a></td> 

i ng kliknij rzędu:

<tr ng-repeat="topic in topics" ng-click="changeLink($index)"> 

http://jsfiddle.net/n8s7ns7h/

Answer 3

Dodaj atrybut link do swojej tablicy obiektów tak:

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

]; 

ng-repeat="topic in topics" 

a href

<a href="{{topic.link}}">