如何用angularjs给从后台传来数据添加链接

 <!DOCTYPE html>

 <html ng-app="myApp">

 <head>

 <meta charset="UTF-8">

  <title>angular</title>

 </head>

 <body ng-controller="myCtrl">

    <table>

     <tr ng-repeat="name in names">

      <td><a  href="http://{{name.url}}" target="_blank">{{name.name}}</a><div  style="display:none">{{name.url}}</div></td>

      <td ng-bind="name.age"></td>

      <td ng-bind="name.sex"></td>

     </tr>

    </table>

 </body>

 <script src="js/jquery-1.11.1.min.js"></script>

 <script src="js/angular.min.js"></script>

 <script>

  angular.module('myApp',[]).controller('myCtrl',function($scope){

   $scope.names=[{

     "name": "xiaohaong",

     "age": 12,

     "sex": "女",

     "url":"www.trs.com.cn"

 },

 {

     "name": "xiaoming",

     "age": 18,

     "sex": "男",

     "url":"www.trs.com.cn"

 },{

     "name": "xiaoqing",

     "age": 12,

     "sex": "女",

     "url":"www.trs.com.cn"

 },{

     "name": "xiaoqinag",

     "age": 19,

     "sex": "男",

     "url":"www.trs.com.cn"

 }];

  })

$scope.names后面为自己定义的一个数组，ng-repeat是将这个数组进行了遍历，遍历之后就会得到每个对象，然后利用json的属性/属性值，最终通过住属性来获得对应的属性值，而链接href也是从数据中获得。

页面显示效果如下：

巴特西

如何用angularjs给从后台传来数据添加链接

最新文章

热门文章