javascript - 在 Angular JS 的动态下拉列表中选择默认值

Question

这是我的代码，这里有什么问题

<select name="countryName" class="form-control" ng-model="twoFAData.country" style="height:35px">
  <option ng-repeat="country in contriesWithCode" value="{{country[2]}}" ng-selected="accountDetailsRes.country == country[2]">{{country[1]}} ({{country[0]}})</option>
</select>

在JS中我定义了这个

$scope.defaultCountry = "USA";

$rootScope.accountDetailsRes = {country: $scope.defaultCountry, state: "selectstate"}; // its default country

提前致谢

Answer 1

首先，我建议您使用 ng-options在有很多下拉选项时代替 ng-repeat，因为它表现更好。

<select ng-options="country[0] as country[0].concat(' ('+country[1]+')') for 
  country in contriesWithCode" ng-model="twoFAData.country" 
  name="countryName" class="form-control" style="height:35px">
</select>

然后，如果您想要一个默认值，只需设置 $scope.twoFAData.country = 'USA' 或 $scope.twoFAData.country = $scope.defaultCountry。

app.controller('BaseController', function($scope) {
  $scope.defaultCountry = "USA";
  $scope.twoFAData = {};
  $scope.twoFAData.country = $scope.defaultCountry;
  $scope.contriesWithCode = [['USA', 'United States'], ['ARG', 'Argentina']];
});