如何在ng-repeat中进行动态范围迭代

时间:2016-06-14 04:52:59

标签: angularjs

我的控制器中有这样的范围

$scope.chats1 ={user_name:item.user_name,user_photo:item.user_photo}
$scope.chats2 ={user_name:item.user_name,user_photo:item.user_photo}
$scope.chats3 ={user_name:item.user_name,user_photo:item.user_photo}

这是我目前的ng-repeat:

<ul>
<li ng-repeat="x in chats1"></li>
<li ng-repeat="x in chats2"></li>
<li ng-repeat="x in chats3"></li>
</ul>

我的问题是如何制作包含我所有范围的单个ng-repeat

<ul>
    <li ng-repeat="x in chats"> /* defines $scope.chats1,$scope.chats2,$scope.chats3 */
</li>
 </ul>

谢谢你,我非常感谢你的帮助

1 个答案:

答案 0 :(得分:1)

它的简单只是将你的范围对象推入一个数组,称之为聊天。并重复它。整个代码是:

<!DOCTYPE html>
<html ng-app="hcApp">

  <head>
    <script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller = "hcAppCtrl">
    chats: {{chats}}
    <br>
    <br>
    <div ng-repeat="data in chats">{{data.user_name}}</div>

<script>
angular.module('hcApp',[])
.controller('hcAppCtrl', ['$scope',function($scope){

  $scope.chats1 ={user_name:"alex",user_photo:"awesome"}
  $scope.chats2 ={user_name:"rumba",user_photo:"damn"}
  $scope.chats3 ={user_name:"sunil",user_photo:"hero"}
  var temp = [];

  temp.push($scope.chats1,$scope.chats2,$scope.chats3);

  $scope.chats =temp;
}]); 
</script>
 </body>
</html>

以下是工作人员:http://plnkr.co/edit/AByjditVwjJzbcMTkS7T?p=preview