-1

以下のような「ボックス」ルート/コントローラーがあります。

export default Ember.Controller.extend({
    initialized: false,
    type: 'P',
    status: 'done',
    layouts: null,
    toggleFltr: null,
    gridVals: Ember.computed.alias('model.gridParas'),
    gridParas: Ember.computed('myServerPars', function() {
        this.set('gridVals.serverParas', this.get('myServerPars'));
        this.filterCols();

        if (!this.get('initialized')) {
            this.toggleProperty('initialized');
        } else {
            Ember.run.scheduleOnce('afterRender', this, this.refreshBox);
        }

        return this.get('gridVals');
    }),
    filterCols: function()
    {
        this.set('gridVals.layout', this.get('layouts')[this.get('type')]);
    },
    myServerPars: function() {
        // Code to set serverParas
        return serverParas;
    }.property('type', 'status', 'toggleFltr'),
    refreshBox: function(){
        // Code to trigger refresh grid
    }
});

私のルートは次のようになります。

export default Ember.Route.extend({
    selectedRows: '',
    selectedCount: 0,
    rawResponse: {},
    model: function() {
        var compObj = {};
        compObj.gridParas = this.get('gridParas');
        return compObj;
    },
    activate: function() {
        var self = this;
        self.layouts = {};

        var someData = {attr1:"I"};
        var promise = this.doPost(someData, '/myService1', false); // Sync request (Is there some way I can make this work using "async")
        promise.then(function(response) {       
            // Code to use response & set self.layouts
            self.controllerFor(self.routeName).set('layouts', self.layouts);
        });
    },
    gridParas: function() {
        var self = this;
        var returnObj = {};
        returnObj.url = '/myService2';
        returnObj.beforeLoadComplete = function(records) {          
            // Code to use response & set records
            return records;
        };
        return returnObj;
    }.property(),   
    actions: {      
    }
});

私のテンプレートは次のようになります

{{my-grid params=this.gridParas elementId='myGrid'}}

私の doPost メソッドは以下のようになります。

doPost: function(postData, requestUrl, isAsync){
    requestUrl = this.getURL(requestUrl);
    isAsync = (isAsync == undefined) ? true : isAsync;
    var promise = new Ember.RSVP.Promise(function(resolve, reject) {
        return $.ajax({
            // settings
        }).success(resolve).error(reject);

    });
    return promise;
  }

上記の設定を踏まえて、実行の流れ/順序を理解したいと思いました (つまり、さまざまなフックについて)。私はデバッグしようとしていましたが、あるクラスから別のクラスに飛び続けました。また、具体的な質問が 2 つあります。

  1. 「アクティブ化」フックが最初に起動されることを期待していましたが、そうではないことがわかりました。最初に「gridParas」フック、つまり「activate」フックを実行します。テンプレートに「gridParas」を指定したせいでしょうか？

  2. /myService1 に対して this.doPost() を実行するときは、「同期」リクエストでなければなりません。そうしないと、実行の流れが変わり、エラーが発生します。実際には、 filterCols() コントローラー内のコード、つまり this.set('gridVals.layout', this.get('layouts')[this.get('type')]) を、応答を受信した後にのみ実行したい/myService1 から。ただし、現時点では、「同期」リクエストを使用してそれを行う必要があります。そうしないと、「非同期」を使用すると、実行が filterCols() に移動し、まだ応答がないため、エラーがスローされます。

追加するために、私はEmber v 2.0を使用しています

4

2 に答える 2

0

一般的に、このレベルでは、フレームワークに対して多くの戦いをしていると思うので、アーカイブがどのように機能するかを尋ねるだけでなく、アーカイブしたいものを説明する必要があります!

しかし、私はあなたのコメントからこれを取り除きます。

まず、doPost メソッドは必要ありません。jQuerysは、 !$.ajaxを使用して Promise に解決できる thenable を返します。Ember.RSVP.resolve

次へ: 実際に何かをレンダリングする前にデータをフェッチしたい場合は、modelフックでこれを行う必要があります!

を取得/service1してから、応答を使用して へのリクエストを作成する/service2か、または両方のサービスを個別に取得してからデータ (グリッド?) を両方のサービスのデータとともに表示できるかどうかはわかりません。したがって、ここに両方の​​方法があります：

両方のサービスを個別に取得できる場合は、ルートmodelフックでこれを行います。

return Ember.RSVP.hash({
  service1: Ember.RSVP.resolve($.ajax(/*your request to /service1 with all data and params, may use query-params!*/).then(data => {
    return data; // extract the data you need, may transform the response, etc.
  },
  service2: Ember.RSVP.resolve($.ajax(/*your request to /service2 with all data and params, may use query-params!*/).then(data => {
    return data; // extract the data you need, may transform the response, etc.
  },
});

/service1フェッチするための応答が必要な場合は/service2、モデル フックで次のようにします。

return Ember.RSVP.resolve($.ajax(/*/service1*/)).then(service1 => {
  return Ember.RSVP.resolve($.ajax(/*/service2*/)).then(service2 => {
    return {
      service1,
      service2
    }; // this object will then be available as `model` on your controller
  });
});

これで問題が解決しない場合 (これで問題が解決すると思います)、問題を説明してください。

于 2016-01-27T23:19:00.743 に答える