javascript - Angular 选择未从 ng-model 分配中获取设置

Question

所以我有一个选择集，我想将其默认为登录用户的状态。返回的状态 JSON 是 StateCode 例如“MI”

<div>
  <select 
    name="ParentState" 
    ng-model="selectedState" 
    ng-options="s.StateCode for s in cStates track by s.StateID | orderBy:'StateCode'">
  </select>
</div>

在我的 Controller 中

var init = function() {
  angular.forEach(xStates, function(xS) {
    if (xS.StateCode == xParentState) {
      $scope.selectedState = xS.StateID;
      $scope.vName = "It's working!" + $scope.selectedState;
    }
  });
}

init();

init 函数中的最后一行仅写入 {{ vName }}，以便我可以看到该函数正在工作以及 $scope.selectedState 的值是正确的，例如 "MI" 将为 23，但加载页面时的选择未设置为 "MI"。

Answer 1

我认为这里可能会出现一些问题，并且我对您想要的结果进行了一些最佳猜测。首先s.StateCode for s...在你的标记中将填充你的 <option>与StateCode 。您提到您希望看到"MI" ，所以让我们将其更改为 StateName 。其次，默认$scope.selectedState作为我们的模型，不需要指定 StateId - 只需选择对象，AngularJS 就会满足默认的 ng-options 。这是一个完整的示例，其中包含一些我认为您想要的解释。

<select 
    name="ParentState" 
    ng-model="selectedState" 
    ng-options="s.StateName for s in xStates track by s.StateID | orderBy:'StateCode'">

<小时/>

app.controller('ctrl', ['$scope', function($scope) {

    $scope.xStates  = [{'StateCode': 1, 'StateID': 'A', 'StateName': 'AL'}, 
                    {'StateCode': 23, 'StateID': 'B', 'StateName': 'MI'},
                    {'StateCode': 50, 'StateID': 'C', 'StateName': 'Hawaii'}];

    angular.forEach($scope.xStates, function (xS) {
        if (xS.StateCode === 23) { // -- for demo simplicity
            $scope.selectedState = xS;
        }
    });
}]);

JSFiddle Link - 工作演示