Question

我使用can.Model.List为用户列表创建了一个带有canjs的简单MVC应用程序。由于我的请求可能需要5秒以上，我会在加载过程中在视图中添加一些预加载消息/图像。

即。我会这样的（我正在使用小胡子）

var users = new Users.List({});
element.html(can.view('myView', users);

使用此模板：

{{#if loading}}
   <p>Loading, please wait...</p>
{{else}}
   <ul>
      {{#each this}}
         <li>User {{ name }} {{ surname }}</li>
      {{/each}}
   </ul>
{{/if}}
</ul>

我可以通过使用一个新的可观察变量来解决，但我认为有一种更好的方法可以在视图中直接管理这个延迟数据。

有什么想法吗？

Answer 1

您可以使用list promise plugin在正在解决延期时显示加载指标：

var users = new Users.List();
users.replace(Users.findAll());
element.html(can.view('myView', { users: users });

这甚至可以让您显示加载错误消息：

{{#if users.isPending}}
   <p>Loading, please wait...</p>
{{else}}
  {{#if users.isResolved}}
   <ul>
      {{#each users}}
         <li>User {{ name }} {{ surname }}</li>
      {{/each}}
   </ul>
   {{else}}
   There was an error loading the user list.
   {{/if}}
{{/if}}
</ul>

在model.list加载期间显示加载程序消息的最佳方法

1 个答案: