Question

我有一个列出专辑的应用。单击相册时，AlbumView和App.overlay（也是视图）都会显示。

App.overlay = Ember.View.create({...})（类似Lightbox的叠加层）。

和

App.AlbumView = Ember.View.extend({
  // close the selected album view by closing the overlay
  close: function() {
    App.overlay.close();
  }
});

问题在于：我希望能够通过点击叠加来关闭这两个视图，但我希望叠加层保持{em>独立 AlbumView，以便我可以使用其他地方的叠加（即不引入两者之间的耦合）。我该怎么办？

这是我目前的实现，紧耦合，我真的不喜欢：

App.overlay = Ember.View.create({
  // handle clicking anywhere on the overlay
  click: function() {
    this.close();
  },

  // close the overlay (setting selectedAlbum's controller content to null hides the AlbumView)
  close: function() {
    App.selectedAlbumController.set('content', null); // this should not be here
    this.remove();
  }
});

Answer 1

我只是在学习余烬，所以带上一粒盐......

您可以向叠加层添加“可见”属性，然后从其他AlbumView中观察它。像这样：

var overlay = Ember.View.create({
  visible: true,
  click: function() {
    this.close();
  },
  close: function() {
    this.set('visible', false);
    this.remove();
  }
});

App.AlbumView = Ember.View.extend({
  overlayClosed: function() {
    App.selectedAlbumController.set('content', null);
    this.remove();
  }.observes('overlay.visible')
});

Answer 2

如何在mixin中提取close方法？

App.AlbumClosing = Ember.Mixin.create({
    close: function() {
        App.selectedAlbumController.set('content', null);
        this.remove();
    }
});

var overlay = Ember.View.create(App.AlbumClosing, {
    click: function() {
        this.close();
    }
});

在恩伯的可靠观点

2 个答案: