Javascript 在Angularjs中显示输出时删除重复名称

我有一个json（在我的控制器中），如下所示

和我的视图（index.html），如下所示

水桶
产品代码
分配#
{{p.bucket}}
{{p.productCode}}
{p.countOfAllocatedAccount}

电流输出为

但我正在寻找以下输出

---

你可以这样做

将当前桶值与前一个桶值进行比较，如果它们相同，则不显示

<tr ng-repeat="p in products">
    <td><span ng-show="products[$index-1].bucket != p.bucket">{{p.bucket}}</span></td>                                     
    <td><span>{{p.productCode}}</span></td>
    <td><span>{{p.countOfAllocatedAccount}}</span></td>                     
</tr> 

{{p.bucket}}
{{p.productCode}}
{p.countOfAllocatedAccount}

---

您可以在这里看到结果

您可以这样做

将当前桶值与前一个桶值进行比较，如果它们相同，则不显示

<tr ng-repeat="p in products">
    <td><span ng-show="products[$index-1].bucket != p.bucket">{{p.bucket}}</span></td>                                     
    <td><span>{{p.productCode}}</span></td>
    <td><span>{{p.countOfAllocatedAccount}}</span></td>                     
</tr> 

{{p.bucket}}
{{p.productCode}}
{p.countOfAllocatedAccount}

您可以在此处看到结果

函数myCtrl（$scope）{
var jsonData=[
{
“桶”：“>120”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：640
},
{
“桶”：“>120”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1391
},
{
“桶”：“1-30”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1081
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：408
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：998
},                      
{
“桶”：“X”，
“产品代码”：“SBML+”，
“AllocatedAccount计数”：93
}
];
$scope.products=jsonData；
}

水桶
产品代码
分配#
{{p.bucket}}
{{p.productCode}}
{p.countOfAllocatedAccount}

函数myCtrl（$scope）{
var jsonData=[
{
“桶”：“>120”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：640
},
{
“桶”：“>120”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1391
},
{
“桶”：“1-30”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1081
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：408
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：998
},                      
{
“桶”：“X”，
“产品代码”：“SBML+”，
“AllocatedAccount计数”：93
}
];
$scope.products=jsonData；
}

水桶
产品代码
分配#
{{p.bucket}}
{{p.productCode}}
{p.countOfAllocatedAccount}

//创建应用程序模块
var myAppModule=angular.module（“myApp”，[]）；
控制器（“MyCtrl”，函数（$scope，$http）{
var jsonData=[
{
“桶”：“>120”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：640
},
{
“桶”：“>120”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1391
},
{
“桶”：“1-30”，
“产品代码”：“SBHL”，
“AllocatedAccount计数”：1081
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
“AllocatedAccount计数”：408
},
{
“桶”：“1-30”，
“产品代码”：“SBML”，
<tr ng-repeat="p in products">
    <td><span ng-show="products[$index-1].bucket != p.bucket">{{p.bucket}}</span></td>                                     
    <td><span>{{p.productCode}}</span></td>
    <td><span>{{p.countOfAllocatedAccount}}</span></td>                     
</tr>