gpt4 book ai didi

javascript - ng-repeat in Repeat 不重复嵌套对象 Angular

转载 作者:行者123 更新时间:2023-12-02 16:08:06 29 4
gpt4 key购买 nike

我有一个带有类别的对象,在这个对象内部有一个名为 items 的对象,其中包含带有 items 的对象。

现在我想重复显示这样的项目:

    <div ng-if="delivery_items" ng-repeat="(k, cat_item) in delivery_items">
<div class="item-cat-header">
<i class="fa fa-arrow-circle-right"></i> {{cat_item.item_category_name}}
</div>
<div class="item-rule" ng-repeat="item in cat_item.items">
<div class="item-info">
{{item.item_name}}
<p class="item-desc"></p>
</div>
<div class="item-price">

</div>
</div>
</div>

但由于某种原因它显示错误

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in cat_item.items, Duplicate key: undefined:undefined, Duplicate value: undefined

json 对象如下所示:json object

我做错了什么?

编辑:

数组创建部分:

            //set menu list
if ($scope.categories_norm) {
$scope.delivery_items = {};

//get categories
angular.forEach(data.item_categories.normal_categories, function (v, k) {
//push categories
$scope.delivery_items[v.item_category_id] = v; //create empty catagory object
$scope.delivery_items[v.item_category_id]['items'] = [];


if ($scope.items) {

angular.forEach($scope.items, function (val, key) {
if (v.item_category_id == val.item_category_id) {
$scope.delivery_items[v.item_category_id]['items'][key] = val;
}
});
}

});
}

最佳答案

您的问题是由于数组中存在漏洞(稀疏数组)。我可以看到您的第一个 item 数组的长度为 39,但数组中确实没有 39 个项目。通过查看快照(0、9、16,22 等..),它非常明显。 ng-repeat 默认情况下将跟踪 ID(除非您设置 track by)作为 $hashkey 属性附加到每个重复项目,但是当其中一项不可用,它实际上是未定义 (items[1]),因此 (undefined) 将被设置为键,但是然后它再次获得另一个未定义的项目(items[2]),因此它会在转发器错误中抛出重复。您可以通过通过 $index 进行跟踪来快速修复。

 <div class="item-rule" ng-repeat="item in cat_item.items track by $index">

但现在它将显示空的 item-rule 部分。因此,您应该通过清理或正确设置值来修复数组本身。检查您的数组创建部分。

<小时/>

将数组创建部分添加到问题中后进行更新

您的问题出在第二个循环中(请参阅 if 之前的注释)。

angular.forEach($scope.items, function (val, key) {
//If the condition here is not met you basically skip that index in the array
//Remember key represents index of the original array you are iterating through
if (v.item_category_id == val.item_category_id) {
$scope.delivery_items[v.item_category_id]['items'][key] = val;
}
});

改变

$scope.delivery_items[v.item_category_id]['items'][key] = val;

使用array.push

$scope.delivery_items[v.item_category_id]['items'].push(val);

关于javascript - ng-repeat in Repeat 不重复嵌套对象 Angular,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30517500/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com