Question

我有这个以角度

定义的选择框

<select data-ng-model="data.hours" data-ng-options="value for value in range.hours" class="dateSelect"></select>
<select data-ng-model="data.minutes" data-ng-options="value for value in range.minutes" class="dateSelect"></select>
<select data-ng-model="data.period" data-ng-options="value for value in range.period" class="dateSelect"></select>

控制器定义默认值：

$scope.data.hours = currentHours > 12 ? parseInt($scope.range.hours[currentHours - 13]) : parseInt($scope.range.hours[currentHours -1]);
$scope.data.minutes = parseInt(date.getMinutes());
$scope.data.period = currentHours> 12 ? 'PM' : 'AM';

我的默认值数组：

$scope.range.hours = [1,....,12];
$scope.range.minutes = [0,....,59];
$scope.range.period = ['AM','PM'];

一切正常，当我想要选择的默认值是每个数组上的最后一个值时，exept会执行因此，如果我想要：11小时，58分钟，AM它工作正常，并且用户可以看到选择中的元素。如果我想要：12小时59分钟PM，那些盒子是空的，当我检查元素时，我得到了这个：

<option value="? string:PM ?"></option>

似乎无法弄清楚问题是什么......

编辑：范围周期阵列上的错字。

EDIT2：在尝试了我能想到的一切之后，决定将范围更改为一系列对象。它们以这种方式定义：

range.period = [{label:"AM",value:"AM"},{label:"PM",value:"PM"}];

标记也改变了：

<select data-ng-model="data.period" data-ng-options="opt as opt.label for opt in range.period" class="dateSelect"></select>

模型以这种方式设置：

$scope.data.period = currentHours> 12 ? $scope.range.period[1] : $scope.range.period[0];

由于我将整个对象传递给数据，因此我需要在将数据对象提交到后端之前添加变通方法，以便它只传递所选的值。

$scope.data.period = $scope.data.period.value;

这是一个糟糕的解决方案，但它是我能做到的最好的解决方案。希望我能找到之前实施的错误（想知道，出于好奇现在。）希望这可以帮助有同样问题的人。

Answer 1

您错过了引用，这可能会破坏您的代码：

$scope.range.period = ['AM','PM'];

Answer 2

请

var app = angular.module('app', []);

app.controller('homeCtrl', function($scope) {

  $scope.range = {};
  $scope.data = {};

  var d = new Date();
  var currentHours = d.getHours();
  $scope.range.period = ['AM', 'PM'];

  $scope.data.period = currentHours > 12 ?  $scope.range.period[1] :  $scope.range.period[0];

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
  <div ng-controller="homeCtrl">
    <select data-ng-model="data.period" data-ng-options="value for value in range.period" class="dateSelect"></select>


  </div>
</div>

无法使用ng-option选择数组的最后一个值

2 个答案: