异步 – 没有Ember Data的AJAX承诺

我决定不使用余烬数据，因为它不是准备就绪并且仍在变化。我的应用程序只需要做一些ajax请求，所以它不应该太大的区别。我无法理解如何处理ajax promise响应。

当我的用户加载应用程序时，他们已经有了验证的会话。我正在尝试ping该用户信息的服务器并将其显示在我的模板中。看来我的模板是在我的ajax请求返回结果之前呈现的，然后不会用承诺进行更新。

// route
App.ApplicationRoute = Ember.Route.extend({
    setupController: function(){
        this.set("currentUser",App.User.getCurrentUser());
    }
});
 
 
// model
App.User = Ember.Object.extend({
    email_address: '',name_first: '',name_last: '',name_full: function() {
        return this.get('name_first') + ' ' + this.get('name_last');
    }.property('name_first','name_last')
});
App.User.reopenClass({
    getCurrentUser: function() {
        return $.ajax({
            url: "/api/get_current_user",type: "POST",data: JSON.stringify({})
        }).then(function(response) {
            return response;
        });
    }
});

在我的模板中

<h1> Hey,{{App.currentUser.name_first}}</h1>

在收到响应或延迟呈现之前，如何更新模板，直到我有回应？

其实答案很简单：你不需要使用承诺。而只是返回一个空对象。您的代码可能如下所示：

App.User.reopenClass({
    getCurrentUser: function() {
        var user = App.User.create({}); //create an empty object
        $.ajax({
            url: "/api/get_current_user",data: JSON.stringify({})
        }).then(function(response) {
            user.setProperties(response); //fill the object with your JSON response
        });
        return user;
    }
});

这里发生了什么？

>创建一个空对象。
>您对API进行异步调用…
> …在你的成功回调你填补你的空对象。
>返回您的用户对象。

注意：真正发生了什么？上述流程不是这些操作发生的顺序。实际上，首先执行点1,2和点。然后一段时间后，当响应从您的服务器返回时，执行3。所以真正的行动流程是：1 – > 2 – > 4→> 3。

所以通常的规则是总是返回一个使Ember能够执行其逻辑的对象。您的案例中首先不会显示任何值，一旦您的对象被填充，Ember将启动它的魔法并自动更新您的模板。不需要努力工作在你身边！

超越最初的问题：用数组怎么做？
按照这个一般规则，你将返回一个空数组。这里有一个例子，假设你可能希望从你的后端获取所有用户：

App.User.reopenClass({
    getAllUsers: function() {
        var users = []; //create an empty array
        $.ajax({
            url: "/api/get_users",}).then(function(response) {
            response.forEach(function(user){
                var model = App.User.create(user); 
                users.addObject(model); //fill your array step by step
            });
        });
        return users;
    }
});

异步 – 没有Ember Data的AJAX承诺

猜你在找的Ajax相关文章