angularjs ngМодель не выбирает опцию в выбранном входе

Question

Использует ли ngModel по-разному для ввода типа текста и выбора? Элемент управления select не выбран, чтобы отображать начальное значение модели.

Когда я изменяю значение изменения select, input и currentUser.field, но если я изменяю значение входного текста на другой ключ, ничего не происходит.

{{currentUser.field}} // show correct field field key (number) val 

// ng-model works => show correct field key (number) val 
<input ng-model="currentUser.field" type="text" /> 

// <option value="?" selected="selected" label=""></option> is selected 
<select ng-model="currentUser.field" 
    ng-options='item.key as item.value for item in currentUser.collections.field '> 
</select> 

// only works with input text and {{currentUser.field}} 
<button ng-click='currentUser.field = 305'>select field (int)</button> 
<button ng-click='currentUser.field = "305"'>select field (string)</button> 

Answer 1

Ваш код должен просто работать, если вы не устанавливаете значение currentUser.field, которое не в ваших вариантах:

var app = angular.module('app', []); 
 

 
app.controller('myController', function($scope) { 
 
    $scope.currentUser = { 
 
    collections: { 
 
     field: [{ 
 
     key: '1', 
 
     value: 'one' 
 
     }, { 
 
     key: '2', 
 
     value: 'two' 
 
     }, { 
 
     key: '3', 
 
     value: 'three' 
 
     }] 
 
    } 
 
    }; 
 
    $scope.currentUser.field = "2"; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
 
<div ng-app='app' ng-controller='myController'> 
 
    <h3>expression</h3> 
 
    {{currentUser.field}} 
 
    
 
    <h3>input</h3> 
 
    <input ng-model='currentUser.field' type='text'> 
 
    
 
    <h3>select</h3> 
 
    <select ng-model='currentUser.field' ng-options='item.key as item.value for item in currentUser.collections.field'></select> 
 
    
 
    <h3>buttons</h3> 
 
    <button ng-click='currentUser.field="305"'>305</button> 
 
    <button ng-click='currentUser.field="1"'>1</button> 
 
</div>