Ember JS:观察被破坏物体的属性

时间:2012-03-19 16:18:25

标签: javascript ember.js

我正在开发一个简单的应用程序,它在Github上显示特定仓库的问题列表。下面是IssueView的代码,它生成问题的html并插入DOM

 App.IssueView = Ember.View.extend({
   tagName: "li",
   classNames: ["sugar", "issue_wrapper"],
   templateName: "app/templates/issue",
   init: function() {
     App.LabelsController.addObserver("label", this, this.labelUpdated);
     this._super();
   },
   click: function(event) {
     var target = event.target;

     if (target.className == "title") {
       // Using bindingContext is a temporary solution to access data of this issue
       App.IssuesController.set("issue", this.bindingContext);
       App.IssuesController.set("state", "viewIssueDetails").notifyPropertyChange("state");
     }
   },
   labelUpdated: function() {
     this.labels = this.labels || this._collectLabels(),
     label = App.LabelsController.get("label").name;

     this.set("isVisible", this.labels.indexOf(label) != -1);
   },
   _collectLabels: function() {
     var labels = [];

     this.bindingContext.labels.forEach(function(label) { labels.push(label.name) });

     return labels;
   }
 })

我生成它的方式是

<script type="text/x-handlebars">
  {{#view App.IssuesListView}}
    {{#each App.IssuesController}}
      {{view App.IssueView contentBinding="this"}}
    {{/each}}
  {{/view}}
</script>

我遇到的问题是这一行

App.LabelsController.addObserver("label", this, this.labelUpdated);

每当生成一个新的IssueView并将其插入DOM时,我会在更新LabelsController的'label'属性时收到错误“你无法在被破坏的对象上设置观察到的属性”。当我查看Firebug时,我看到我的IssueView的状态是“destroy”而不是inDOM。我想知道为什么会发生这种情况,我该怎么办才能绕过它呢?

1 个答案:

答案 0 :(得分:2)

模板中的#each帮助程序将确保在问题集合发生更改时创建和销毁IssueViews。您是手动添加观察者,这意味着您也负责删除观察者。我相信使用observes(...)函数原型扩展将为您处理。 (参见“观察财产变化”下的http://ember-docs.herokuapp.com/symbols/Ember.Observable.html)。

如果您想继续使用手动路线,请考虑将addObserver移至didInsertElement并在willDestroyElement中添加相应的removeObserver。

一方面注意:如果我正在理解您正在尝试正确使用此代码,我会考虑绑定到一个ArrayController,它根据所选标签而不是方法处理呈现正确的问题集你正在服用。