Ember.js 延迟余烬视图渲染，直到加载$getJSON

这段代码的问题是渲染代码被输入了两次，而缓冲区不是我期望的地方。即使我得到了缓冲区，我输入的东西也不会呈现在屏幕上

App.FilterView = Ember.View.extend({
init: function() {
    var filter = this.get('filter');
    this.set('content', App.ViewFilter.find(filter));
    this._super();
},

render: function(buffer) {
    var content = this.get('content');
    if(!this.get('content.isLoaded')) { return; }

    var keys = Object.keys(content.data);
    keys.forEach(function(item) {
        this.renderItem(buffer,content.data[item], item); 
    }, this);

}.observes('content.isLoaded'),

renderItem: function(buffer, item, key) {
    buffer.push('<label for="' + key + '"> ' + item + '</label>');

}
});

---

我正在获取我期望的数据，一旦卸载触发器，一切都会运行，我就不会在浏览器中获取HTML。

结果证明，答案与我在$getJSON调用中使用jquery then（）时得到的结果非常接近。如果您不熟悉承诺，那么文档并不完全是直截了当的。这是你需要知道的。你必须在承诺之外创建一个对象——你将在承诺结束时立即返回，在承诺之内，你将拥有一个函数，在返回数据后更新该对象。像这样：

App.Filter = Ember.Object.extend();
App.Filter.reopenClass({
find: function(o) {
    var result = Ember.Object.create({
        isLoaded: false,
        data: Ember.Object.create()
    });
    $.getJSON("http://localhost:3000/filter/" + o).then(function(response) {
            var controls = Em.A();
            var keys = Ember.keys(response);
            keys.forEach(function(key) {
                controls.pushObject(App.FilterControl.create({
                    id: key,
                    label: response[key].label,
                    op: response[key].op,
                    content: response[key].content
                    })
                );
            });

            result.set('data', controls);
            result.set('isLoaded', true);
    });
    return result;
}
});

then（）中的函数是回调例程，返回数据后将调用该例程。它需要引用您在$getJSON调用之外创建并立即返回的对象。然后，这在视图中起作用：

didInsertElement: function() {

if (this.get('content.isLoaded')) {
    var model = this.get('content.data');
    this.createFormView(model);
}
}.observes('content.isLoaded'),

createFormView: function(data) {
    var self = this;

var filterController = App.FilterController.create({ model: data});
    var filterView = Ember.View.create({
    elementId: 'row-filter',
    controller: filterController,
    templateName: 'filter-form'
    });

    self.pushObject(filterView);
},

---

您可以看到一个完整的应用程序（更完整/复杂一点）示例

您使用的是模型挂钩还是路由器的任何其他部分？通常，从模型钩子返回承诺是正确处理的方式。不，这不是一条路线。这将获取一些用于生成可定制表单的配置数据。其中有好几种，但它们对于不同的高级搜索都遵循相同的模式。高级搜索作为对象列表视图的一部分显示/隐藏为另一个视图。列表视图和过滤器视图将进入容器视图。因此，筛选器视图只是一个视图，可以动态获取配置数据。请尝试使用

new-Ember.RSVP.Promise

而不是

Ember.Object

。在ember API文档中有很好的信息。位于此处：高级用法看起来更符合您试图实现的目标。$.getJSON已经支持Promissions。然后（）我将以此为例进行计算。如果它工作，我会张贴我会在这里更新@B眼睛

didInsertElement: function() {

if (this.get('content.isLoaded')) {
    var model = this.get('content.data');
    this.createFormView(model);
}
}.observes('content.isLoaded'),

createFormView: function(data) {
    var self = this;

var filterController = App.FilterController.create({ model: data});
    var filterView = Ember.View.create({
    elementId: 'row-filter',
    controller: filterController,
    templateName: 'filter-form'
    });

    self.pushObject(filterView);
},