Filter ng-options condition ng-model

Question

I'm trying to filter a select depending on the value selected in another selector. These Common have value. The data are :

Countries

{
  "paisCodigo": "AR",
  "paisNombre": "Argentina",
  "paisVigente": 1
},
{
  "paisCodigo": "CL",
  "paisNombre": "Chile",
  "paisVigente": 1
},
{
  "paisCodigo": "UY",
  "paisNombre": "Uruguay",
  "paisVigente": 1
}

<select name="selectPais" id="selectPais" ng-model="defaultPais" ng-options="pais.paisCodigo as pais.paisNombre for pais in paises track by pais.paisCodigo">
      <option value="">Seleccione país</option>
</select>

Citys

{
  "ciuId": 1,
  "ciuNombre": "Santiago",
  "ciuPaisCodigo": "CL",
  "ciuVigente": 1
},
{
  "ciuId": 2,
  "ciuNombre": "Viña del Mar",
  "ciuPaisCodigo": "CL",
  "ciuVigente": 1
},
{
  "ciuId": 3,
  "ciuNombre": "Valparaíso",
  "ciuPaisCodigo": "CL",
  "ciuVigente": 1
},
{
  "ciuId": 4,
  "ciuNombre": "Quilpué",
  "ciuPaisCodigo": "CL",
  "ciuVigente": 1
},
{
  "ciuId": 5,
  "ciuNombre": "Montevideo",
  "ciuPaisCodigo": "UY",
  "ciuVigente": 1
},
{
  "ciuId": 6,
  "ciuNombre": "Buenos Aires",
  "ciuPaisCodigo": "AR",
  "ciuVigente": 1
}

<select name="selectCiudad" id="selectCiudad"  ng-disabled="!defaultPais" ng-model="defaultCiudad" ng-options="ciudad.ciuId as ciudad.ciuNombre for ciudad in ciudades ((paises | filter:{'ciuPaisCodigo' : defaultPais})) track by ciudad.ciuId">
      <option value="">Seleccione ciudad</option>
</select>

This does not work. I would like to filter the selector cities MAY wish to filter by the value in common with these arrangements example is country code: CL, AR, UY. But I have not been able to get. Any criticism is welcome, I'm new in AngularJS and also in ionic.

Answer 1

No criticism necessary. You just need to leverage ng-change.

In you first dropdown, and an ng-change. Make a function in the controller that updates the array that you will use in the second dropdown.

I am going to do a quick work around... notice I am not passing pais to the function

<select name="selectPais" id="selectPais" ng-model="defaultPais" ng-options="pais.paisCodigo as pais.paisNombre for pais in paises track by pais.paisCodigo" ng-change="updateTheOtherDropdown()">
      <option value="">Seleccione país</option>
</select>

In your controller, put the pseudocode. You should be able to access the selected object with $scope.defaultPais

$scope.updateTheOtherDropdown =function()
{    

here you can use $scope.defaultPais to filter your next array.

$scope.ciudades = whatever you filtered;
}