jeudi 3 décembre 2015

Ember app not sorting properly when reload page, but sorts fine otherwise

I have an Ember app that allows sorting by columns.

Here's the relevant part of the controller:

  sortedOrders: Ember.computed.sort('content.orders', function(tuple1, tuple2) {
    //sorting logic here
  }),

The route logic uses queryParams as follows:

  queryParams: {
    account: {
      refreshModel: true
    },
    status: {
      refreshModel: true
    },
    sortAsc: {
      refreshModel: true
    },
    sortField: {
      refreshModel: true
    }
  },

  model: function(params) {
    var account_id   = (params.account && (params.account > 0)) ? params.account : undefined;
    var order_status = params.status ? params.status === ORDER.STATUS.ALL ? undefined : params.status : ORDER.STATUS.OPEN;

    return Ember.RSVP.hash({
      orders       : this.store.query('order', {per_page: ORDER.PER_PAGE, status: order_status, acct_id: account_id}), 
      accounts     : this.store.query('account', {per_page: 100})
    });
  },

  afterModel: function(model) {
    var instruments = model.orders.mapBy("instrument_id");
    this.subscribeToMarketData(instruments, ENV.APP.CONSTANTS.POLLING.MARKETDATA, ["Last"], false);
  }

The relevant part of the template is just using #each on sortedOrders.

When I refresh the page in my Ember app, the selected column is not initially appearing in sorted order. However sorting works just fine when you click on a column to sort it after the initial load.

It seems that when sortedOrders is first called into when the page is reloaded, the values are all null or undefined in the model, because not everything has come in or resolved yet.

Is there some way to make sure that on initial load the app will actually be properly sorted by the selected column? I suppose I could just force the page to reload after initially loading, but that seems like a pretty hacky solution.

Hopefully that made sense and gives enough context.




Aucun commentaire:

Enregistrer un commentaire