ng-init nicht das ausgewählte Modell nicht initialisieren

Question

ich eine Option wählen, wo ich eine Liste der Titel, dh Herren bekommen, Frau, Dr. etc. von einer API, sieht der Code wie folgt in dem vorderen Ende:

<select class="form-control" name="titleSelect" id="titleSelect" ng-options="option.value for option in titleData.availableOptions track by option.key" ng-model="adult[$index].selectedTitle" ng-init="adult[$index].selectedTitle = titleData.availableOptions[0]"></select> 

Und das in der Steuerung:

var getPassengerTitle = PassengerDetailsAndCardDetailsService.getPassengerTitle(); 

PassengerDetailsAndCardDetailsService ist Dienst, wo ich die API-Daten, dh die Titeldaten erhalten. Außerdem gibt dieser Service ein Versprechen.

Dies ist, wo ich den Titel Datensatz:

getPassengerTitle.then(function(result){     
     $scope.availableTitles = angular.fromJson(result.titleList); 
     $scope.tempListOfTitles = []; 

     for(var key in $scope.availableTitles){    
      $scope.tempListOfTitles.push({key : key, value : $scope.availableTitles[key]}); 
     };  

     $scope.titleData = { 
       availableOptions: $scope.tempListOfTitles, 
     }; 

    }); 

Wenn ich versuche, auf die erste Option ng-init (dh Herr) ist es nicht wie in einer leeren Option funktioniert gezeigt. Wenn ich jedoch versucht habe, die titeldata in einem Objekt statisch zu definieren, könnten Sie mir bitte helfen?

UPDATE:

ich nicht zu erwähnen, dass die Titeldaten innerhalb einer ng-repeat eingegeben werden für mehrere Personen/Passagiere in diesem Fall zu unterstützen. Daher benutze ich Erwachsenen [$ index], wo es ein ng-Modell für jede Person/Passagier erstellt.

Answer 1

Ich bin mir nicht sicher, ob dies das gewünschte Verhalten ist, aber wenn Sie den Titel beim Auswählen einer Option initialisieren möchten, können Sie entweder den Wert ng-model verwenden oder den Ereignishandler ng-change verwenden. Hier ist ein Beispiel , das die Änderung behandelt und den neuen Wert ng-model zuweist. Lassen Sie mich wissen, wenn dies das ist, was Sie gesucht haben

Answer 2

versuchen Sie es so.

var myapp = angular.module('app', []); 
 
myapp.controller('Main', function ($scope) { 
 
var vm = this; 
 
    vm.adult = { 
 
       'selectedTitle':'1' 
 
      }; 
 
    vm.titleData = [ 
 
        {'key':'0','value':'Mr'}, 
 
        {'key':'1','value':'Ms'}, 
 
        {'key':'2','value':'Dr'} 
 
        ]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app = "app"> 
 
    <div ng-controller="Main as ctrl"> 
 
<div class="select-style"> 
 
    <select ng-options="option.key as option.value for option in ctrl.titleData" ng-model="ctrl.adult.selectedTitle"></select> 
 
</div> 
 
    </div> 
 
</div>