0

私はビューを書きました：

export default Ember.View.extend({
  select: null,
  modify: null,

  createSelect: function() {
    return new ol.interaction.Select();
  },

  onMapCreated: function() {
    this.select = this.createSelect();
    this.modify = this.createModify();
  },

  init: function() {
    this._super();
    this.get('controller').addObserver('olMap', this.onMapCreated);
  },
});

ビューは、 olMapプロパティを持つコントローラーに関連するテンプレートに追加されます。ビューで何らかの作業を行う前に、 olMapプロパティがインスタンス化されるのを待つ必要があります。

上記のコードは、 onMapCreated関数で参照されているthisがコントローラーのインスタンスであり、ビューのインスタンスではないことを除いて、機能しています。

アプリケーションの設計で何か間違ったことをしていると確信しています。関係を切り分けて描画部分をメインコントローラーの外に出したい。コンポーネントを使用する必要がありますか? 再利用できないのでわかりませんが…

ここでいくつかの方向性を示したいと思います。

4

2 に答える 2

1

APIセクションのマニュアルを読んだ後、解決策を思いつきました。誰かがいつかそれを必要とするので、ここに投稿します。実際には、コンテキストを変更するためにaddObserverメソッドにパラメーターthisを追加するだけで済みました。

export default Ember.View.extend({
  select: null,
  modify: null,

  createSelect: function() {
    return new ol.interaction.Select();
  },

  onMapCreated: function() {
    this.select = this.createSelect();
    this.modify = this.createModify();
  },

  init: function() {
    this._super();
    this.get('controller').addObserver('olMap', this, this.onMapCreated);
  },
});
于 2015-04-04T09:43:06.970 に答える
0

これが私が最終的に得たものです：

私のセットアップ：

残り火: 1.10.0

Ember データ : 1.0.0-beta.16

jQuery: 1.11.2

ディレクトリ構造:

  • コントローラー:
    • map.js
    • map-draw.js
  • テンプレート
    • map.hbs
    • map-draw.hbs
  • ビュー
    • map.js
    • map-draw.js

テンプレートtemplates/map.jsでは、次のようなレンダー ヘルパーを使用します。

{{render "mapDraw" mapDraw}}

レンダラーはコントローラーcontrollers/map-draw.jsとビューviews/map-draw.js を使用します

ビューmap-draw.jsのコンテンツ:

export default Ember.View.extend({
  templateName: "mapDraw",
  classNames: ["map-draw"]
});

コントローラーmap-draw.jsでmap.jsコントローラーをバインドしています。

export default Ember.Controller.extend({    
  needs: ['map'],
  olMap: null,
  //...//
  init: function() {
    this._super();
    this.get('controllers.map').addObserver('olMap', this, function(sender) {
      this.set('olMap', sender.get('olMap'));
    });
  }
  //...//
});
于 2015-04-04T14:42:25.753 に答える