Question

Emberjs能够在加载模型时自动提升视图。例如，使用以下模板

{{#each controller}}
    {{name}}   
{{each}}

每次加载控制器中的模型时，视图都会更新。

但是，如果我们需要实现不支持此功能的自定义视图，该怎么办呢？确切地说，我需要一个渲染图形图表的视图。我使用了一些第三方库。我在控制器中的数据代表了我的视图应该呈现为图表的一些点。通常使用这些第三方库，我们需要设置数据，然后调用draw函数。

问题在于，当我将controller.model绑定到我的chart数据时，图表不知道这些数据是否真的被加载并且draw函数崩溃了。所以我想，我需要一些观察者，但我无法弄清楚它放在哪里。我的尝试是观察controller.model.isLoaded，并在其发生变化时致电draw。但它只运行一次，当我在我的路线上来回走动时，draw不再被调用，因为模型已全部加载。

Answer 1

您可以在插入视图时设置条件。

{{#if controller.model.isLoaded}}
Put your chart view in here
{{/if}}

只有在模型加载后才会呈现视图

Answer 2

您可以从绑定的model属性切换到包装器chartData属性。然后，chartData属性可以依赖于model和lastUpdate。最后添加一个刷新update()属性的lastUpdate方法。然后，调用更新将自动触发chartData绑定的刷新，从而触发图表。

lastUpdate: new Date(),

chartData: function() {
  return this.get('model');
}.property('model', 'lastUpdate'),

update: function() {
  this.set('lastUpdate', new Date());
}

如何在加载模型时更新View

2 个答案: