当前位置: 首页 > 面试题库 >

如何循环通过ng-repeat函数返回的项目?

壤驷经国
2023-03-14
问题内容

我想重复创建div,这些项目是函数返回的对象。但是,以下代码报告错误:达到10个$
digest()迭代。流产!jsfiddle在这里:http://jsfiddle.net/BraveOstrich/awnqm/

<body ng-app>
  <div ng-repeat="entity in getEntities()">
    Hello {{entity.id}}!
  </div>
</body>

问题答案:

简短的回答
:您真的需要这样的功能还是可以使用属性?http://jsfiddle.net/awnqm/1/

长答案

为简单起见,我仅描述您的情况-ngRepeat对象数组。另外,我将省略一些细节。

AngularJS使用脏检查来检测更改。当应用程序启动时运行$digest$rootScope$digest将对作用域的层次结构进行深度优先遍历。所有范围都有手表清单。每个手表都有最后一个值(最初是initWatchVal)。对于所有手表的每个作用域,$digest它都会运行,获取当前值(watch.get(scope))并将其与进行比较watch.last。如果当前值不等于watch.last(始终用于第一次比较),则$digest设置dirtytrue。如果处理所有范围,dirty == true $digest则从开始另一个深度优先遍历$rootScope$digest当脏== false或遍历次数==
10时结束。在后一种情况下,错误“达到10 $ digest()迭代”。将被记录。

现在大约ngRepeat。对于每次watch.get调用,它将来自集合(返回值getEntities)的对象与其他信息一起存储在缓存中(HashQueueMaphashKey)。对于每个watch.get调用ngRepeat尝试通过其hashKey缓存获取对象。如果它在缓存中不存在,则将其ngRepeat存储在缓存中,创建新的作用域,在其上放置对象,创建DOM元素,等等。

现在大约hashKey。通常hashKey是由生成的唯一编号nextUid()。但这可以起作用。hashKey生成后存储在对象中以供将来使用。

为什么您的示例会产生错误
:函数getEntities()总是返回带有新对象的数组。该对象hashKeyngRepeat缓存中不存在也不存在。因此ngRepeat,每个watch.get手表都会为for生成新的作用域{{entity.id}}。这只手表先watch.getwatch.last== initWatchVal。这样watch.get()!=watch.last。因此$digest开始新的遍历。因此ngRepeat用新的手表创造了新的范围。所以… 10个遍历后,您会得到错误。

如何解决

  1. 不要在每次getEntities()调用时都创建新对象。
  2. 如果需要创建新对象,则可以hashKey为其添加方法。有关示例,请参见本主题。

希望知道AngularJS内部知识的人会在我做错事情时纠正我。



 类似资料:
  • 如果以前有人问过这个问题,我很抱歉,但我找不到答案。如何循环使用嵌套数组的数组,并在控制台中打印项目出现的实例数? 因此应该打印出名称“bob”的数字2,因为“bob”在数组中出现两次。 这是我的阵列和我目前拥有的:

  • 问题内容: 无论如何,有没有一项要计数,然后在循环之外显示呢? 我曾经尝试过没有成功,因为我认为每次都压倒一切。 无论如何,在我的控制器中未执行任何功能就可以做到这一点吗? 问题答案: 在ng-repeat中初始化的代码将具有不同的作用域,并且无法在循环外部访问。 试试这个:

  • 问题内容: 我一直在尝试为JavaScript中动态创建的“ a”标签的onclick事件分配一个函数。所有标记均按如下所示循环创建: 所有四个链接的警报值始终为“ 4”。很明显。谷歌搜索时,我遇到了显示以下代码片段的帖子: 我设法根据需要对其进行了调整,并使alert(i)正常工作,但是如果有人可以确切解释以上代码的作用,我将不胜感激。 问题答案: 当您将功能分配给单击处理程序时,将创建一个闭包

  • 我正在尝试迭代一个JSON对象。 对于下面的代码: 在第一个ng-repeat中:< br > < code > { { user . type } } outputs ' Parent '(如预期一样),< br > < code > { { user . options } } outputs '[{ " option 1 ":" 11 qwert "," option2":"22QWERT"

  • 问题内容: 我可以仅在AngularJs中使用一个数组同时遍历两个数组吗?如果是这样,那又如何? 例如我有两个数组 它应该能够为两个数组产生相同的索引。 问题答案: 如果要使用第一个数组的索引访问第二个数组,请尝试以下操作: 看到这个小提琴:http : //jsfiddle.net/dm9zhgx9/

  • 问题内容: 嘿,我有这段代码: 它可以工作,但是我想在循环中添加一些额外的条件,例如: 我怎样才能做到这一点? 问题答案: 使用(或): 附加到元素,这将决定是否显示它。 ng- if的 文档可以在此处找到。 但是,如果只想在循环第一个或最后一个项目时执行某项操作,则也可以使用和的属性。这些已用ng- repeat记录 。可以这样使用: