我试图在我的节点应用程序视图中隐含一个简单的Ember应用程序。我知道Ember已设置并且我的套接字可以正常工作，现在唯一的问题是即使正在检索数据也似乎没有返回数据。
这是我所拥有的：
App = Ember.Application.create({
rootElement: '#ember'
});
App.Router.map(function() {
// put your routes here
});
App.IndexRoute = Ember.Route.extend({
model: function() {
async.waterfall([
function (callback) {
socket.emit('getUserList', { data: null });
callback(null, '');
}, function (res, callback) {
var userList = new Array();
socket.on('recieveUserList', function (data) {
for(var i=0; i<data.userList.length; i++) {
userList.push(data.userList[i].name);
}
});
callback(null, userList);
}
], function (err, result) {
return result;
});
}
});
现在，如果我console.log(results)返回['John Smith'，'Jane Doe']，但它不会在以下页面上显示出来：
<script type="text/x-handlebars">
<ul>
{{#each item in model}}
<li>{{item}}</li>
{{/each}}
</ul>
</script>
通过查看示例，它应该起作用，对吗？
编辑这是小提琴http://jsfiddle.net/UJ4Su/
修理小提琴
在您看来，请尝试以下操作：
<script type="text/x-handlebars" data-template-name="index">
<ul>
{{#each item in model}}
<li>{{item}}</li>
{{/each}}
</ul>
</script>
（请注意此模板对索引路由的显式引用）
这是您正在使用的小提琴的更新版本：
请注意，此示例不适用于您的套接字，因为您没有返回承诺。由于您要返回普通数组（从技术上讲，您没有返回任何内容，因为您在异步套接字调用之外没有返回调用），因此Ember希望数据立即存在。有关如何解决此问题，请参见下文。
在路由第1部分中处理异步呼叫
由于您正在进行异步调用以填充用户列表，因此您需要先返回一个空的用户列表，然后在套接字事件解决后填充它。这是一个小提琴，它使用setTimeout演示了套接字调用的异步特性，以进行演示：
App.IndexRoute = Ember.Route.extend({
model: function(){
var data = Ember.A();
window.setTimeout(function(){
data.pushObject('a');
data.pushObject('b');
data.pushObject('c');
}, 1000);
return data;
}
});
您还需要使用一个Ember数组（相对于本机Javascript数组），以便Ember可以观察该数组上的更改并为您更新模板。
（有关在Ember中利用异步路由的更多信息，请参见此页面：http : //emberjs.com/guides/routing/asynchronous-routing/）
利用Ember.Deferred或Ember.RSVP
上面的内容非常简单，但是如果您想利用Ember的更多优势，那么我建议您直接使用Ember.Deferred或RSVP Promises。Ember.Deferred是一个简单的mixin，充当一些RSVP功能（特别是then（），resolve（）和reject（））的包装。这是使用Deferred的示例：
App.IndexRoute = Ember.Route.extend({
model: function(){
var deferredData = Ember.Deferred.create();
var data = [];
window.setTimeout(function(){
data.push('a');
data.push('b');
data.push('c');
deferredData.resolve(data);
}, 3000);
return deferredData;
},
actions: {
loading: function(transition, originalRoute){
return true;
}
}
});
基本上，我们返回Ember.Deferred而不是Ember Array。在解决延迟问题之前，Ember将过渡到加载状态。然后，您可以在检索数据时（通过套接字或AJAX）向用户显示加载数据消息。这是一个有效的小提琴示例：
这是使用Ember Promises的示例：
有关加载/错误子状态的更多信息，请参见以下网址：http : //emberjs.com/guides/routing/loading-and-error-substates/
希望有帮助！
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句