handhaben zwei verschiedene Modelle für ein Dropdown-Menü

Question

Ich habe zwei verschiedene Modelle ist $ Scope.veh.vehCode und $ scope.veh.vehName. Nach der Auswahl des Fahrzeugnamens aus dem Dropdown-Menü muss vehCode an das Back-End gesendet werden. Während der Fahrzeugaktualisierung muss das zuvor ausgewählte Fahrzeug vehName, aber mein Modell $ scope.veh.vehCode ausgefüllt werden. Wie befülle ich den VehName in DropDown?

für Update-Fahrzeug Ich werde GetRecycles Rest Anruf, als Antwort bekomme ich Fahrzeug Name, der VehName ist.

$scope.veh.vehCode = response.VehName 

<label>Vehicle Name </label> 
      <ui-select name="model" id = "model" ng-model="veh.vehCode" ng-disabled="disabled" class="w-md mb-10"> 
      <ui-select-match placeholder="Select or search a veh in the list...">{{$select.selected.model}}</ui-select-match> 


       <small ng-bind-html="model.vehCode | highlight: $select.search"></small> 
      </ui-select-choices> 
      </ui-select> 
     </div> 

Answer 1

Sie ng-options und ui-select2 Tag verwenden, können dieses Problem umgehen:

vehic model:

vehics = [{name: "name1", value: 1000},{name: "name2", value: 2000}] 

html code:

<label class="control-label">vehic name</label> 
<select ui-select2 style="width: 100%" name="vehicName" ng-model="vehicCode" 
     ng-options="vehic.code as vehic.name for vehic in vehics" 
     required> 
    <option value="">--select vehic--</option> 
</select> 

Mit diesem Code Sie sehen vehic names in Ihrem Dropdown-Menü, und wenn Sie einen Artikel auswählen, erhalten Sie Ihre ng-model erhalten vehic code Wert.