javascript - Select 不保留用户选择的值

Question

我是 Angular 的新手，我很困惑于一个简单的选择问题。

我做了一个简单的选择，它迭代我的范围来填充选择，但是在用户单击一个选项(创建良好)后，我的选择变为空白，内部没有选择，如果我再次单击它，则没有选择选项可见。

下面是我的代码:

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

app.controller("myCtrl", function($scope) {
$scope.searchFilterDispatcher = {};
$scope.searchFilterDispatcher.distributionCode = [{
  id: 1,
  label: 'dist1'
}, {
  id: 2,
  label: 'dist2'
}];


});

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

<select ng-model="searchFilterDispatcher.distributionCode" 
        ng-options="item as (item.label | uppercase) for item in 
 searchFilterDispatcher.distributionCode"  
        class="form-control" 
        id="distributionCode">
	<option >{{'SELECT_A_VALUE' | translate}}</option>
</select>

有什么提示吗？

Answer 1

你应该像下面这样改变你的 ng-model 。它在代码片段中工作

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

app.controller("myCtrl", function($scope) {
    $scope.searchFilterDispatcher = {};
    $scope.searchFilterDispatcher.distributionCode = [{
      id: 1,
      label: 'dist1'
    }, {
      id: 2,
      label: 'dist2'
    }];
    
    
});

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

<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="val" ng-options="item as (item.label | uppercase) for item in searchFilterDispatcher.distributionCode" class="form-control" id="distributionCode">
</select>
</div>