-1

ルーターイベントを実装しようとしており、ルーターの送信機能を使用してルーターでイベントをトリガーしています。しかし、これに関するドキュメントを取得できませんでした。
私が実装しようとしているのは、コントローラー/ビューからイベントを発生させて、サーバーからデータを取得することです。そして、イベントはサーバーからデータを非同期にフェッチし、データが正常にフェッチされたら、イベントを呼び出した場所からビューの子ビューを初期化したいと考えました。つまり、データがいつフェッチされたかを知る必要があります。しかし、ルーターのイベントは、通話がいつ終了したかを知ることができるようなものを返すとは思いません。
次のようなもの:
ビュー:

Em.View.extend({
   click: function(){
       var recordsPromise = this.get('controller.target').send('getRecords');
       recordsPromise.done(this.initiateProtocol);
   },

   showChild: false,
   initiateProtocol: function(){
       //this showChild is used as a condition in the template to show/hide
       // the childview. And is being set after the call completed 
       // successfully
       //here childOneView is present some other js file and is fetched using requirejs
       require(['childOneView'], $.proxy(function(childOneView){
           this.set('childOne', childOneView.extend({
               templateName: 'childOne'
           });
           this.set('showChild', true); 
       }, this));

   }
}

ルーター

Em.Route.extend({
    events: {
        getRecords: function(){
            //make an ajax call to fetch the records and return the ajax as a
            // promise
        }
    }
});

テンプレート

{{#if view.showChild}}
    {{view view.childOne}}
{{/if}}
4

1 に答える 1

0

慣用的な Ember のアプローチは少し異なると思います。アクションをコントローラーに送信し、ルートにバブリングさせてから、バインディングを介してビューが応答するプロパティを設定します。

意見

App.RecordsView = Em.View.extend(Ember.ViewTargetActionSupport, {
  click: function(){
    this.triggerAction({action: 'getRecords'})
  }
});

コントローラ

App.RecordsController = Em.ArrayController.extend({
  content: [],
  isLoaded: false
});

テンプレート

<!-- records.handlebars -->
{{#if isLoaded}}
  render stuff here... perhaps {{#each this}}{{someRecordProperty}}{{/each}}
{{/if}}

ルーター

App.RecordsRoute = Em.Route.extend({
  events: {
    getRecords: function(){
      var controller = this.controllerFor('records');
      $.ajax(...).then(function(data){
        Em.run(function(){
          controller.setProperties({
            content: data.foo,
            isLoaded: true
          });
        });
      });
    }
  }
});
于 2013-05-03T14:32:09.490 に答える