a href don't work with ng-repeat in my case

Question

demo : http://plnkr.co/edit/ktnDiUSA7eU7DNkIbTqo

   <ul>
       <li ng-repeat="thread in data">
           <a href="{{thead.url}}" target="_blank">
                {{thread.title}}
           </a>
       </li>
   </ul>

I got my json like this

$scope.data = [
{
    "title": " 'Aku kecewa, tiada harapan kalahkan DAP'",
    "desc": "BACKER QUITS ?",
    "starter": "rhoyo",
    "replies": " 23 ",
    "url": "https://forum.lowyat.net/Kopitiam/topic/3235530"
},
{
    "title": " Angry China launches war against terror ",
    "desc": "",
    "starter": "rivost",
    "replies": " 6 ",
    "url": "https://forum.lowyat.net/Kopitiam/topic/3235746"
}

];

why when I do {{thread.url}} it did print out the direct url?

Answer 1

You need to use Angular's ngHref directive. Simply replace href with ng-href .

Take a look here: https://docs.angularjs.org/api/ng/directive/ngHref

Answer 2

At first you should fix typo thread.url instead of thead.url

Then replace href attribute with ng-href

<a ng-href="{{thread.url}}" target="_blank">
    {{thread.title}}
</a>