Question

是否有可能

<tbody ng-repeat="Emp in Employees"  ng-repeat="Dept in Department">

    <td> <span>{{Emp.id}}</span></td>
    <td> <span>{{Emp.name}}</span></td>
     <td> <span>{{Dept.Deptid}}</span></td>

 </tbody>

这意味着两个不同的来源....它是针对复合UI要求的。如果没有，替代方式是什么？

我不是在寻找

<tbody ng-repeat="Emp in Employees" >

    <td> <span>{{Emp.id}}</span></td>
    <td> <span>{{Emp.name}}</span></td>

</tbody>

<tbody ng-repeat="Dept in Department">

      <td> <span>{{Dept.Deptid}}</span></td>
       <td> <span>{{Dept.Deptname}}</span></td>                                

</tbody>

类似于C＃中的LINQ类似

var x = (from a in AList
          join b in BList on a.item = b.item
          select new{....});

Answer 1

您可以通过合并两个数组

来实现

app.controller('MainCtrl', function($scope) {
  $scope.Employees = [{
    'id':1,
    'name':'rachit1'
  },
  {
    'id':2,
    'name':'rachit2'
  }];
  $scope.Department=[{
    'Deptid':'1D',
    'Deptname':'dep1'
  },
  {
    'Deptid':'2D',
    'Deptname':'dep2'
  }];
  $scope.result=merge($scope.Employees,$scope.Department);

  function merge(obj1,obj2){ // Our merge function
    var result = {}; // return result
    for(var i in obj1){      // for every property in obj1 
        if((i in obj2) && (typeof obj1[i] === "object") && (i !== null)){
            result[i] = merge(obj1[i],obj2[i]); // if it's an object, merge   
        }else{
           result[i] = obj1[i]; // add it to result
        }
    }
    for(i in obj2){ // add the remaining properties from object 2
        if(i in result){ //conflict
            continue;
        }
        result[i] = obj2[i];
    }
    return result;
}
});

HTML： -

 <body ng-controller="MainCtrl">
   <table>
       <tbody ng-repeat="Emp in result">
    <td> <span>{{Emp.id}}</span></td>
    <td> <span>{{Emp.name}}</span></td>
     <td> <span>{{Emp.Deptid}}</span></td>
     <td> <span>{{Emp.Deptname}}</span></td>

 </tbody>
     </table>
  </body>

Plunker

Answer 2

答案是：不能。因为循环计数可能不同。

你能在另一个循环语句上写一个循环语句吗？

for (var i=0;i<Empcount;i<DeptCount;i++)
{
// code

}

这是不可能的，与你的问题的答案相同。你可以考虑结果。

Answer 3

我知道这不是一个真正的答案，但我必须这样说：您的数据组织不正确。违反了数据完整性。

但如果由于某种原因无法更改源结构，请尝试在控制器中组合这些数据：

$scope.employees = employees.map(function (employee, index) {
   employee.department = departments[index];

   return employee;
})

然后在ng-repeat：

中使用它

<tbody>
   <tr ng-repeat="employee in employees">
      <td>{{ employee.id }}</td>
      <td>{{ employee.name }}</td>
      <td>{{ employee.department.deptId }}</td>
   </tr>
</tbody>

备注：

请勿重复<tbody>代码。

如果Departments.length === Employees.lengh并且订单正确，则应用此技术。

不要将构造函数大写。将Departments重命名为departments，将Employees重命名为employees。

如果td > span上没有任何样式，则删除不必要的跨度

是否可以为ng-repeat提供2个数据源？

3 个答案: