Ember Computed Property Sort Troubles

54 Views Asked by At

I'm having some sorting issues inside one of my components and cannot seem to figure it out. Currently it seems to be sorting correctly, but it's putting what should be the 2nd one sorted, at the bottom. Here is my component, hoping someone could give some insight here...Thanks.

import Component from '@ember/component';
import { inject as service } from '@ember/service';
import EmberObject, { computed, observer } from '@ember/object';

export default Component.extend({
  googleMapsApi: service(),
  geolocation: service(),
  sortDefinition: ['distanceTo'],
  sortedVineyards: Ember.computed.sort('model', 'sortDefinition'),
  didInsertElement() {
    this.send('distanceFrom');
  },
  actions: {
    distanceFrom(){
      let distanceFromLoading = this.get('distanceFromLoading');
      let userLocation = this.get('userLocation');
      var userLocationLat = userLocation[0];
      var userLocationLon = userLocation[1];
      let userLocationFormat = '' + userLocationLat + ',' + userLocationLon;
      // console.log(userLocationFormat);
      var self = this;
      let model = this.get('model');
      // console.log(model);
      model.forEach(function(item) {
        let endLocation = '' + item.get('location');
        self._super(...arguments);
        self.get('googleMapsApi.google').then((google) => {
          var self = this;
          let distanceMatrixService = new google.maps.DistanceMatrixService();
          function calculateDistance() {
            distanceMatrixService.getDistanceMatrix({
              origins: [userLocationFormat],
              destinations: [endLocation],
              travelMode: google.maps.TravelMode.DRIVING,
              unitSystem: google.maps.UnitSystem.IMPERIAL,
              avoidHighways: false,
              avoidTolls: false
            }, callback);
          }
          function callback(response, status) {
            if (status != google.maps.DistanceMatrixStatus.OK) {
            } else {
              if (response.rows[0].elements[0].status === "ZERO_RESULTS") {
              } else {
                var distance = response.rows[0].elements[0].distance;
                var distance_text = distance.text;
                item.set('distanceTo', distance_text);
              }
            }
          }
          calculateDistance();
        });
      });
    }
  }
});
1

There are 1 best solutions below

0
On

Turns out in my example, distance_text (the sort definition) was a string. Given my small data set it looked like it was half sorting, when likely it wasn't sorting at all. Turned that number into a proper integer and everything worked nicely.