sort with Angualrjs / orderby by a field that will be created later

Asked

Viewed 232 times

0

I am using Ionic 1 with Angularjs.

I need to sort a result by a field that should be created later, the field is the distance from the first company address, in orderby do not know what to put, and also the object is not being generated correctly.

Or something that rearranges the list right after the generation of it.

Obs. I do not want to sort the addresses within the company, I want to order the companies taking into account only the distance from the first address of each company. This distance will be calculated with the user’s GPS data.

I made a Jsfiddle that shows the situation

https://jsfiddle.net/6dg105q8/1/

  • Your problem is in orderby, there is no way it sort why you are passing an invalid value, for the distance field to work, must be in ngRepeat addresses. https://jsfiddle.net/6dg105q8/3/

  • because, that’s the problem, I don’t want to sort the addresses inside the company, I want to order the companies taking into consideration only the distance of the first address of each company.

  • 1

    I think I’ve solved your problem, take a look. https://jsfiddle.net/6dg105q8/4/

  • Boy, that’s right, ng-init worked, put as a solution for me to give you the points.

1 answer

0


Follow the solution to your problem.

In addition to putting the ng-init put a variable called $scope.predicate with the field you want to filter. Because it is a nested field, that is, child of the array elements, you need to define in a variable so that the framework can interpret in the view.

function LoginController($scope) {
  $scope.parceiros = [
    {
      id: 1,
      nome: 'Empresa 1',
      enderecos: [
        {
          rua: 'dos bobos',
          numero: '0',
          lat: '-3.000000',
          long: '-3.000000'
        },
        {
          rua: 'dos bobos',
          numero: '230',
          lat: '-3.500000',
          long: '-3.500000'
        }
      ]
    },
        {
      id: 2,
      nome: 'Empresa 2',
      enderecos: [
        {
          rua: 'dos bobos',
          numero: '120',
          lat: '-3.700000',
          long: '-3.700000'
        },
        {
          rua: 'dos bobos',
          numero: '121',
          lat: '-3.200000',
          long: '-3.200000'
        }
      ]
    }
  ];
  
  $scope.predicate = 'enderecos[0].distancia';
    
  $scope.distancia = function(lat1, long1, userLat, userLong) {
  	
    return Math.floor((Math.random()*4)+1);
  };
};
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
Quando a distancia do primeiro endereço da empresa 2 for menor que o primeiro endereço da empresa 1, a order tem que ser trocada. <br>
Obs. Vai dando RUN para ver que nada muda, a distancia é um random, somente para o exemplo.
<br>
<div ng-app ng-controller="LoginController">
  <div ng-repeat="parceiro in parceiros | orderBy:predicate:reverse">
    <div style="border: 1px solid black;">
      {{parceiro.nome}}
      <div ng-repeat="endereco in parceiro.enderecos | orderBy: '+distancia'" ng-init="endereco.distancia = distancia(lat, long, 0, 0)">
        -- Rua: {{endereco.rua}} - Numero: {{endereco.numero}} - distância: {{endereco.distancia}}
      </div>
    </div>
  </div>
  
  
  <br>
  <br>
  <br>
  <br>
  <p>Aqui é só para mostrar que o campo foi criado dentro do objeto.</p>
  
  {{parceiros}}
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.