angularjs – 使用带有$index的角度ng-repeat,数据没有得到反映

发布时间：2020-12-17 16:55:33 所属栏目：安全来源：网络整理

导读：当数据来自数据库时,DOM没有反映出来. 当页面加载我在productList数组中有一些数据并且应用了一些过滤器(比如价格应该在500-1000之间)之后,请求转到API并且更新的productList来自响应.但产品没有反映在页面上. 我将数据发送到一个指令,该指令显示了来自ng-re

当数据来自数据库时,DOM没有反映出来.
当页面加载我在productList数组中有一些数据并且应用了一些过滤器(比如价格应该在500-1000之间)之后,请求转到API并且更新的productList来自响应.但产品没有反映在页面上.

我将数据发送到一个指令,该指令显示了来自ng-repeat的productList的单独产品,我的代码如下：

<div ng-repeat="product in productList track by $index">

解决方法

我发现当我们从作用域传出数据时,$index会导致问题.因此数据丢失和DOM无法更新.

我通过使用product.id作为ng-repeat中的键来找到解决方案,如下所示：

<div ng-repeat="product in productList track by product.id">

但是,当多个产品具有相同的id时,上述代码再次失败并抛出以下错误,因为如果产品具有相同的id ng-repeat,则将这些产品视为相同：

angular.js：11706错误：[ngRepeat：dupes]不允许在转发器中重复.使用’track by’表达式指定唯一键.中继器

所以最后我通过制作ng-repeat的动态唯一键来解决问题,如下所示：

<div ng-repeat="product in productList track by (product.id + $index)">

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!