AngularJS - Uhr arbeitet nicht auf Variable

Question

Dieser Code funktioniert nicht und ich kann nicht sagen, warum.

HTML

<select id="provincia" class="form-control" ng-model="ciudades" ng-options="provincia for (provincia, ciudades) in provincias"> 
<option ng-model="valor_ciudad" value=''>Elegir</option> 
</select> 

JS

$scope.$watch('ciudades', function(newval, oldval){ 
     debugger; 
     if (newval){ 
      $scope.prov = newval; 
     } 
    }); 

Was soll ich tun? Ich versuche, den vom Benutzer gewählten Wert zu erhalten, weil die Variable ciudades ein Array von Werten hat.

$scope.provincias = {Florida:['Miami', 'Orlando']} 

Wenn der Benutzer Florida nimmt, dann wird $ scope.ciudades sein [ 'Miami', 'Orlando']. Was ich wissen muss, ist, wenn der Benutzer Florida oder eine andere Stadt wählt. (.watch hat nicht funktioniert, nicht einmal auf Debugger gestoppt)

Habe ich mich klar gemacht?

Answer 1

können Sie die ‚Florida‘ verwenden Schlüssel als Schlüssel und Wert und auf die prov direkt mit den ng-Modells wählen Sie dann, hören für prov Änderungen und setzen ciudades basierend auf dem ausgewählten Schlüssel:

var app = angular.module('app', []); 
 
app.controller('AppCtrl', function($scope, $compile, $timeout) { 
 
    $scope.provincias = { 
 
    Florida: ['Miami', 'Orlando'] 
 
    }; 
 
    $scope.$watch('prov', function(newval, oldval){ 
 
    $scope.ciudades = $scope.provincias[newval]; 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="AppCtrl"> 
 
    <select ng-model="prov" ng-options="key as key for (key, value) in provincias"> 
 
    <option ng-model="valor_ciudad" value=''>Elegir</option> 
 
    </select> 
 
    <br> 
 
    $scope.prov: {{prov}}<br> 
 
    $scope.ciudades: {{ciudades}}<br> 
 
</div>