Selects dependent on 3 levels in Angular JS

For this you must do something like this:

Defines the 3 selectors

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

<select name="selectDepartamento" id="selectDepartamento" ng-disabled="!data.defaultPais" ng-model="data.defaultDepartamento" ng-options="departamento.deptoId as departamento.deptoNombre for departamento in departamentos_filter " ng-change="updateDropDownProvincias(data.defaultDepartamento)">
    <option value="">Seleccione departamento</option>
</select>


<select name="selectProvincias" id="selectProvincias" ng-model="data.defaultProvincias" ng-options="provincia.proNombre for provincia in provincias_filter">
    <option value="">Seleccione categoría</option>
</select>

As you can tell in the first select you give the options of your country arrangement or your list, each country SHOULD have a code ( pais.paisCodigo in this example) define a ng-model that is data.defaultPais . When this selector changes it calls the updateDropDownDepartamentos function that the country that you selected receives as a parameter.

$scope.updateTheOtherDropdown = function(pais) {
    $scope.departamentos_filter = $filter('filter')($scope.departamentos, { deptoPaisCodigo: pais });
}

In this function, within your Departments arrangement, filter by those that only have the deptoPaisCodigo that you selected in the first selector and declare the variable $ scope.departamentos_filter that you occupy to fill the second selector. This in the third selector occurs in the same way.

I leave you a codepen so you can understand it better Codepen Select