Javascript 数组长度不正确

我有以下代码：

public toggle(event): void {
    console.log(event.currentTarget.parentNode.children);

html:

主体元素从ng重复渲染：

<div ng-repeat="activity in vm.activities.items track by activity.id" class="activity-body">

仅供参考，html结构如下：

<div>
    <div class="activity-header" timeline-item ng-click="vm.toggle($event);">
        <i class="material-icons">person</i>
    </div>
    <div ng-repeat="activity in vm.activities.items track by activity.id" class="activity-body">
        <div class="contact-moment">
            <i class="material-icons">person</i>
            <div class="contact-moment-body">
                <b>{{vm.activity.channel | activityChannel}}: <span ng-bind-html="vm.case.title || (vm.activity | activityTitle)"></span></b>
                <br />
                <div ng-include="'/CustomerService/ActivityTimeline/ActivityTemplates/' + activity.type + '.html'" id="{{activity.type}}"></div>
            </div>
        </div>
    </div>
    <div class="activity-footer">
        <md-button>
            Button 1
        </md-button>
    </div>
</div>

人
人
{{vm.activity.channel}activityChannel}：


按钮1

---

所以问题是Javascript不计算

activity-body

元素，因为当您

console.log

时，

div.activity-body

还没有呈现到DOM中。展开DOM节点列表时，主体元素已呈现，并且

event.currentTarget.parentNode.children

引用已更新以反映这一点

---

写入日志的内容只是一个快照—当您与它交互时，它会被更新以反映真实世界。

子对象

是一个实时列表，并且

console.log（）

像大多数其他JavaScript一样保存对对象的引用

事件顺序如下：

日志

子项

：其中有2个元素

再添加7个元素

单击控制台中的展开图标，该图标将导致重新检查对象，因此将显示所有9个元素

---

顺便说一句，HTMLCollection！=数组哦，是吗？我以为一个集合就是一个数组。嗯，这可能是一个问题……”HTML DOM中的HTMLCollection是活动的；它会在底层文档更改时自动更新。“@PeterBoomsma如果我没有弄错的话，您将需要

数组。从
使用
数组
等函数对其进行迭代，
过滤器
@马蒂亚斯：你说得对。啊，我不知道。这是有道理的。因此，当我在日志中展开HTML集合时，它会再次检查集合并更新它。好的，谢谢。
<div ng-repeat="activity in vm.activities.items track by activity.id" class="activity-body">

<div>
    <div class="activity-header" timeline-item ng-click="vm.toggle($event);">
        <i class="material-icons">person</i>
    </div>
    <div ng-repeat="activity in vm.activities.items track by activity.id" class="activity-body">
        <div class="contact-moment">
            <i class="material-icons">person</i>
            <div class="contact-moment-body">
                <b>{{vm.activity.channel | activityChannel}}: <span ng-bind-html="vm.case.title || (vm.activity | activityTitle)"></span></b>
                <br />
                <div ng-include="'/CustomerService/ActivityTimeline/ActivityTemplates/' + activity.type + '.html'" id="{{activity.type}}"></div>
            </div>
        </div>
    </div>
    <div class="activity-footer">
        <md-button>
            Button 1
        </md-button>
    </div>
</div>