Angularjs ng-repeat 对象 - 重复值

Question

我有一个数据结构如下的对象，

data = {};

data[user1] = {
 name:  "apple",
 Company: "001"
};
data[user2] = {
 name:  "apple",
 Company: "002"
};
data[user3] = {
 name:  "orange",
 Company: "003"
};

每当添加新用户时，对象都会更新

我正在使用 ng-repeat 迭代此对象以表格格式呈现数据，

<table>
 <thead>
   <tr>
    <td>Name</td>
    <td>Company</td>
   </tr>
 </thead>
 <tbody>
   <tr ng-repeat="(key, value) in data">
     <td>{{$parent.data[key].name}}</td>
     <td>{{$parent.data[key].Company}}</td>
   </tr>
 </tbody>
</table>

我想在 table 中看到的是，因为 "user1" 和 "user2" 具有相同的名称，我希望它以 2 的行跨度打印一次。是有可能吗？

有了这些数据，table 看起来像这样，

我想得到的是，

Answer 1

您之所以看到，是因为您可能将用户的 "name" 放入 user1 变量中。如果我错了请指正

使用这样的东西

data = {};

data[user1+""+data.length()] = {
 name:  "apple",
 Company: "001"
};

或使用增量变量

var i = 0;
data = {};

data[user1+""+i] = {
 name:  "apple",
 Company: "001"
}; 
i++;

或完全删除 user1

var i = 0;
data = {};

data[i] = {
 name:  "apple",
 Company: "001"
};
i++
data[i] = {
 name:  "apple",
 Company: "002"
};

Answer 2

我没有看到使用 rowspan 的简单方法。但是你可以使用 angular.filter 提供的 groupBy 过滤器来做到这一点：

  <table>
    <tr ng-repeat='(key, value) in data | groupBy: "name"'>
      <td>{{key}}</td>
      <td>
        <table>
          <tr ng-repeat='item in value'>
            <td>{{item.Company}}</td>
          </tr>
        </table>
      </td>
    </tr>
  </table>

这里有一个plunk来演示。

Angularjs ng-repeat 对象 - 重复值

Angularjs ng-repeat object - duplicate values

javascript

object

angularjs

ng-repeat