Question

使用AngularJS在HTML中设置选择框的默认值时遇到了麻烦。

这是我在控制器中的范围变量：

$scope.sensorReadingsPerPage = 30;

这是使用控制器的视图中的选择框：

<select id="itemsPerPage" name="itemsPerPage" class="panel panel-default" ng-model="sensorReadingsPerPage" ng-change="changeItemsPerPage()">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30">30</option>
  <option value="40">40</option>
  <option value="50">50</option>
  <option value="100">100</option>
</select>

我希望预先选择“30”值的选项。

我已尝试使用this回答和this one，两者都引用AngularJS documentation on select directive，但在这些情况下，选项正在以动态方式生成，并且范围包含一个包含多个选项的对象其中的价值观。在我的例子中，选项是静态的，并且范围上只有一个变量。

我该如何解决这个问题？有没有办法更改ng-init和ng-options以适合我的情况？

Answer 1

尝试在控制器中设置$scope.sensorReadingsPerPage = "30"。

注意：它应该是一个字符串。

Answer 2

您是否尝试过使用ng-options而不是创建单独的选项元素？

<select id="itemsPerPage" name="itemsPerPage" class="panel panel-default" ng-options="item in items track by $index" ng-model="sensorReadingsPerPage" ng-change="changeItemsPerPage()">

在您的控制器中

$scope.items = [10, 20, 30, 40, 50, 100];
$scope.sensorReadingsPerPage = $scope.items[2];

如何使用AngularJS在选择字段中将预选选项设置为默认选项

2 个答案: