EmberJS - 路由器因承诺而暂停

可以通过从模型钩子返回承诺来暂停转换。可以通过从模型返回普通对象或数组来立即完成转换。

语法

Ember.Route.extend ({
   model() {
      return new Ember.RSVP.Promise(function(param) {
         //代码在这里
      });
   }
});

示例

下面给出的示例展示了如果模型返回承诺,转换将如何暂停。创建一个新路由并将其命名为 promisepause,然后打开 router.js 文件以定义 URL 映射 −

import Ember from 'ember';
//以变量 Ember 的形式访问 Ember.js 库
import config from './config/environment';
//它以变量 config 的形式提供对应用程序配置数据的访问

//const 声明只读变量
const Router = Ember.Router.extend ({
    location: config.locationType,
    rootURL: config.rootURL
});

//定义以参数为对象来创建路由的 URL 映射
Router.map(function() {
    this.route('promisepause');
});

//它指定可供应用程序其他部分使用的 Router 变量
export default Router;

使用以下代码打开在 app/templates/ 下创建的文件 application.hbs 文件 −

<h2>Router Pauses for Promises</h2>
{{#link-to 'promisepause'}}点击此处{{/link-to}}

单击上述链接时,将打开 Promise 暂停模板页面。 promisepause.hbs 文件包含以下代码 −

{{model.msg}}
{{outlet}}

现在使用以下代码打开在 app/routes/ 下创建的 promisepause.js 文件 −

import Ember from 'ember';
import RSVP from 'rsvp';

export default Ember.Route.extend ({
   model() {
      //RSVP.js 是 Promises 的一个实现
      return new Ember.RSVP.Promise(function (resolve) {
         
         Ember.run.later(function () {
            //显示 promise 信息
            resolve ({
               msg: "This is Promise Message..."
            });
         }, 3000); //显示承诺的时间(以毫秒为单位)
      });
   }
});

输出

运行 ember 服务器,您将收到以下输出 −

Ember.js Pause Promise

当您点击链接时,模型将返回承诺,该承诺在 3 秒内不会解决,当承诺实现时,路由器将开始转换 −

Ember.js Pause Promise

emberjs_router.html