具有多个依赖项的Ember属性不会按预期更新

时间:2015-02-25 14:49:40

标签: javascript ember.js

我有以下有关理解余烬属性的问题:

如果我有房产A:

propertyA: function() {
  return this.get("propertyB.someObject.someValue");
}.property("propertyB")

和propertyB:

propertyB: function() {
  return this.get("propertyX.someObject");
}.property("propertyX", "propertyY", "propertyZ")

我在某些模板中绑定了propertyA,如:

{{propertyA}}

然后在我的代码中90%的情况下,当设置 propertyX 时, propertyA 无法正确更新。< / p>

如果我理解正确,那么只要其中一个相关属性(例如 propertyX )发生更改, propertyB 就会变为。这应该会自动使 propertyA ,从而自动更新它,因为它有绑定。

我的代码中发生的是, propertyA 仍然是旧的缓存值,即使我在控制台中调用它,但是当我调用 propertyB 时,它会重新评估并返回更新的代码,因为它很脏。

问题是, propertyB 时,为什么 propertyA 不会自动变脏?是因为 propertyB 在模板中没有绑定吗?我认为如果 propertyA 具有依赖性,则没有必要。

我还发现,当 propertyB 仅依赖于 propertyX 时,不会发生此问题,因此多依赖关系必须以某种方式搞砸。

很抱歉这个非常复杂的解释,但我试图尽可能简单地抽象我的实际代码。

更新

这里有一些实际的代码:

控制器:

styling: function() {
  var clipValues = this.get("clip.styling") || {};
  var infoValues = this.get("clip.info.styling") || {};
  return Ember.Object.create(jQuery.extend({}, clipValues, infos));
}.property("clip.styling", "clip.info.styling"),


showBottombar: function() {
  return (!!this.get("bottombarSrc") || !!this.get("styling.bottombar.fancyStuff"));
}.property("styling"),

其他地方为此控制器设置了剪辑。稍后它的信息会在剪辑模型中更新,这是一个简单的Ember.Object:

getInfo: function(url) {
  var self = this;
  return App.ajax(url).then(function(response) {
    self.set("info", response);
  });
}

现在调用getInfo后,即使“bottombarSrc”和“... fancyStuff”为true,模板中的{{showBottombar}}也会显示“false”。当我从控制台调用“样式”时,它会重新评估样式代码,表示在clip.getInfo发生后(它设置了“info”)它被标记为脏。但这不会影响showBottombar。事后不会被打电话。

更新2

有两种奇怪的方法让它起作用,但我不明白为什么:

首先是为模板添加样式绑定:

{{styling}}

这会导致showBottombar在样式更改后被调用。

第二个是从样式属性中删除其他依赖项:

styling: function() {
  var clipValues = this.get("clip.styling") || {};
  var infoValues = this.get("clip.info.styling") || {};
  return Ember.Object.create(jQuery.extend({}, clipValues, infos));
}.property("clip.info.styling"),

(不再是“clip.styling”依赖)。这也导致showBottombar属性正常工作。两种方式都可以单独使用。

1 个答案:

答案 0 :(得分:0)

 propertyA: function() {
   return this.get("propertyB.someObject.someValue");
 }.property("propertyB").volatile()

http://emberjs.com/api/classes/Ember.ComputedProperty.html#method_volatile