在Meteor模板重绘期间加载消息 [英] Loading message during template redraw in Meteor

问题描述

我制作了我的第一个Meteor应用程序，我喜欢它。除了它现在有真实的生产数据，它有点慢。我收到的报告是当我点击此内容时没有发生任何事情。

I built my first Meteor app and I love it. Except, now that it has real production data in it, it's a little slow. I'm getting reports that "nothing is happening when I click this".

有没有办法在模板重绘期间显示加载消息，以便用户知道发生了什么事吗？

为了进一步说明，请看一下这个模板（不是我的实际代码，仅为了简单起见）：

To illustrate further, look at this template (not my actual code, for simplicity only):

Template.all_posts.posts = function() {
  return Posts.find({'category_id': Session.get('current_category')});
}

因此，如果打开我的控制台并运行 Session.set （'current_category'，1），让我们说运行计算并重绘模板需要2秒钟。我希望在那2秒钟内显示一个加载指示器。

So if open my console and run Session.set('current_category', 1), and let's say it takes 2 seconds to run the computation and redraw the templates. I'd like there to display a loading indicator during that 2 second period.

要清楚，我已经知道如何显示加载指示器。事实上，我已经在初始页面加载时执行此操作并在所有订阅都是 ready（）时隐藏它。我只是想知道在哪里应用相同的逻辑（显示和隐藏加载图标），以便每次重绘模板时都会发生这种情况。伪代码可以正常工作：

To be clear, I already know how to display a loading indicator. In fact, I'm already do that on initial page load and hiding it when all my subscriptions are ready(). I simply want to know where to apply that same logic (showing and hiding loading icon) so that it will happen every time the templates are redrawn. Pseudo code would work fine:

简而言之，当Meteor忙碌时，我想反映一下。

非常感谢任何帮助！

编辑10/09/13：

来自文档......

From the docs...

这些Meteor函数将您的代码作为被动计算运行：

These Meteor functions run your code as a reactive computation:

• 模板


• Meteor.render和Meteor.renderList


• Deps。 autorun

我认为一个可能的解决方案开始并显示加载任何这些计算无效时的指示。

I think one possible solution could begin with displaying a loading indicator when any of these "computations" are invalidated.

例如，如果你的代码是在 Deps.autorun 中运行的，那么计算实例就会被传递作为第一个参数，您可以将回调传递给它的 onInvalidate 方法，如下所示：

For example, if you're code is being run inside of Deps.autorun, the computation instance is passed as the first argument and you can pass a callback to it's onInvalidate method, like so:

Deps.autorun(function(computation) {

  // do reactive stuff

  computation.onInvalidate(function() {
    // display loading indicator
  });
});

但是，据我所知，你无法访问那些其他Meteor方法中的计算对象，只有 Deps.autorun 。

However, to my knowledge, you cannot access the computation object in those other Meteor methods, only Deps.autorun.

至于隐藏加载指标，我认为最好的想法就是由于计算失效，在呈现的回调最后一个要重新渲染的模板。

As far as hiding the loading indicator, I think the best idea would be to do it inside the rendered callback of the last template to be (re)rendered due to the invalidation of the computation.

任何人都有任何见解，建议，技巧，黑客等等吗？

推荐答案

万一你从未解决过这个问题，我想分享另一个用户的解决方案，作为我的问题。通过nate-strauser回答此处：

Just in case you never solved this problem, I'd like to share another user's solution that he posted as part of an answer to my question. Answered here by nate-strauser:

挂钩到集合的.ready（）方法，以确定何时可以显示它。当所有数据都加载到客户端时，这将返回true。你看到空的，然后部分的，然后是完整的渲染，因为你的代码不是在等待所有数据，而是在数据到达时呈现。这不是一件坏事，但并不总是可取的。你可以使用像 https://github.com/oortcloud/unofficial-meteor-faq#how-do-i-know-when-my-subscription-is-ready-and-not -still-loading ，但我建议使用iron-router和waitOn函数来解决相关路线 https://github.com/EventedMind/iron-router#waiting-on-subscriptions-waiton ，当它与loadingTemplate选项结合使用时，你可以制作一个加载时很好（正在加载....）消息，然后立即转换到完全填充的模板

hook into the .ready() method of the collection to determine when you can show it. this will return true when all data is loaded on the client. you are seeing empty, then partial, then full rendering because your code isn't waiting for all data and is rendering as data arrives. this isn't a bad thing, but not always desirable. you can roll your own solution using something like https://github.com/oortcloud/unofficial-meteor-faq#how-do-i-know-when-my-subscription-is-ready-and-not-still-loading , but i would recommend using iron-router with the waitOn function for the route in question https://github.com/EventedMind/iron-router#waiting-on-subscriptions-waiton, when this is used in combination with the loadingTemplate option you can make a nice (Loading....) message while loading, then transition right away to the fully populated template

你可以忽略全部部分。

这篇关于在Meteor模板重绘期间加载消息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！