Ember.js:控制器何时可以访问模型

Ember.js: When is a model accessible to the controller?

本文关键字:访问 模型 何时可 控制器 js Ember      更新时间:2023-09-26

在Ember中,控制器何时可以访问模型?

下面是一个简单的Ember应用程序,它有一个静态模型和一个试图访问init上的模型的控制器。您会注意到,在init上,模型title的属性是undefined。但是,setTimeout说明model稍后可以访问。

我的印象是,在模型准备好之前,Ember不会启动控制器。这是正确的吗?Ember文档(http://emberjs.com/guides/routing/specifying-a-routes-model/)指示在实例化控制器时,即使异步加载,模型也可用。

http://jsfiddle.net/vu263uwq/1/

App = Ember.Application.create({});
App.IndexRoute = Ember.Route.extend({
    model: function() {
        return posts[0];
    }
});
App.IndexController = Ember.ObjectController.extend({
    alertTitle: function() {
        var that = this;
        jQuery(".output").append("1. "+this.get("title")+"<br />"); //Returns "undefined"
        setTimeout(function() {
            jQuery(".output").append("2. "+that.get("title")); //Returns the correct title
        }, 1000);
    }.on("init")
});
var posts = [
    {
        id: 1,
        title: "First title",
        body: "Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna mollis ornare vel eu leo. Cras justo odio, dapibus ac facilisis in, egestas eget quam."
    },{
        id: 2,
        title: "Second title",
        body: "Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod semper. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum."
    }
];

您的印象实际上是错误的。setupController挂钩用于设置控制器上的任何属性,包括模型。实际上,默认情况下,setupController所做的一切都是在控制器上设置模型。这就是为什么如果覆盖钩子并且仍然需要model集,则必须显式设置模型或调用this._super(controller, model)

注意setupController的签名:

setupController: function(controller, model)

为了实现这一点,控制器必须已经在Ember设置模型的点实例化。Init在控制器的实例化过程中被激发。因此,对init的调用发生在设置model之前`

至于异步获取模型,如果您的模型挂钩返回promise,Ember将阻塞,直到一个已完成的promise可以传递到setupController函数中,以便将模型分配给promise的实现,而不是promise本身。它可以让你避免像这样的电话

setupController: function(controller, model){  
   var self = this;
   makeAsyncCallReturningPromise().then(function(result){
       self._super(controller, result);
   }
}

这将基本上完成相同的事情