Javascript HTML动态内容神秘地消失了

我目前正在使用Monaca、Cordova和Onsen UI开发一个混合移动应用程序，但我的问题似乎与javascript更相关

我想动态创建项目列表。对于这个Purpose，我创建了简单的页面模板，下面是关键部分：

<ons-list id="transaction-list"></ons-list>

    <script id="transaction-list-item" type="text/template">
        <ons-list-item class="transaction-item-detail" >
            <div class="left transaction-party">{{name}}</div>
            <div class="center transaction-amount">{{amount}}</div>
            <div class="center transaction-state" style="margin-left: 1em">{{state}}</div>
            <div class="right">
                <ons-icon icon="ion-chevron-right"></ons-icon>
            </div>
        </ons-list-item>
    </script>

这就像一个符咒，我得到了一个生成的列表，其中充满了我保存在存储中的项目，结果如下： 现在开始扭转 我又看了几页，又回到这一页，不知从哪里冒出来，我的列表是空的。我认为，别担心，让我们看看正在发生的事情。因为我的列表似乎没有内容，所以使用jQuery我会记录列表的内容：

        console.log(document.querySelector('#transaction-list'));

结果如下： 看起来，我查询的列表应该具有预期的内容。但当我检查元素时，它看起来确实是空的：

---

我简直不能对这个错误耿耿于怀。我真的非常感谢来自更熟练的程序员同事的任何帮助！提前谢谢。

我认为问题在于你什么时候填写列表以及如何浏览页面。 如果您没有在包含该列表的页面初始化时填写该列表，那么当您返回到此页面时，可能实际上正在创建一个新页面。因此，旧页面仍然存在，正如您的日志所示，列表已填充，但当您返回页面时，您将看到一个新页面，其中当前列表不是新的

我的建议是在初始化页面时调用函数（请参见下面的代码段），或者发布有关如何在页面中移动的更多详细信息，以查看问题

在页面初始化时调用函数：

document.addEventListener('init', function(event) {

      if(event.target.matches('#page_id')){
        showRequests();
      }
}); 

---

我认为问题在于你什么时候填写清单，以及如何浏览这些页面。 如果您没有在包含该列表的页面初始化时填写该列表，那么当您返回到此页面时，可能实际上正在创建一个新页面。因此，旧页面仍然存在，正如您的日志所示，列表已填充，但当您返回页面时，您将看到一个新页面，其中当前列表不是新的

我的建议是在初始化页面时调用函数（请参见下面的代码段），或者发布有关如何在页面中移动的更多详细信息，以查看问题

在页面初始化时调用函数：

document.addEventListener('init', function(event) {

      if(event.target.matches('#page_id')){
        showRequests();
      }
}); 

---

问题是由页面移动模式引起的：ons navigator。我对页面堆栈管理不善，导致了这个意外错误。 重置ons navigator的页面堆栈后，所有内容都按应加载

---

感谢大家花时间处理此问题。

此问题是由页面移动模式引起的：ons navigator。我对页面堆栈管理不善，导致了这个意外错误。 重置ons navigator的页面堆栈后，所有内容都按应加载

感谢大家花时间处理这个问题