Question

我试图用Angular创建可靠的下拉列表。经过大量的调试后，我发现我的问题是角度版本。因此，Angular的最新版本在我的下拉列表中生成了一个看起来像<option value="? string:October ?"></option>的新奇怪选项。因此，经过几次战斗后，我发现它正在使用Angular 1.2.27。我更喜欢使用新版本的角度功能。

是否有其他方法可以在最近的版本中使用它？

这是我的代码：

<!DOCTYPE html>
<html ng-app="supervisor">
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.js"></script>
<script type="text/javascript" language="JavaScript">
    angular.module('supervisor', [])
            .controller('testCtrl', ["$scope", function ($scope) {
                $scope.loanYears = {"2014": ["October", "September"], "2015": ["November", "December"]};
            }]);
</script>
</head>
<body>
<div class="row clearfix" ng-controller="testCtrl">
<form id="target">
    <select ng-model="months" id="year" name="yearRequired"
            ng-options="year for (year, months) in loanYears">
        <option value="">Select</option>
    </select>

    <select ng-model="month" ng-disabled="!months" id="month" name="monthRequired" 
            ng-options="month as month for month in months">
        <option value="">Select</option>
    </select>
</form>
</div>

</body>
</html>

因此，要获得不良行为，请参阅：http://plnkr.co/edit/aTwXhg5W8RHml9FpDX78?p=preview然后选择2014-＆gt; September-＆gt; 2015-＆gt;出现注入奇怪的空白选项。

谢谢！

Answer 1

空选项按角度添加，因为未选择有效选项。要摆脱这个预选值。

示例（将以下内容添加到控制器并重试）

$scope.months = $scope.loanYears["2014"]
$scope.month = $scope.loanYears["2014"][0]

可能更好的方法是预先选择ng-change上的月份

http://plnkr.co/edit/jeC7hEjnuvneoq0GR7xm?p=preview

控制器：

$scope.setMonths = function(months) {
               if(months && months.length > 0) {
                  $scope.month = months[0]
               }
            }

你的HTML中的

：

<select ng-model="months" id="year" name="yearRequired"
        ng-change="setMonths(months)"
        ng-options="year for (year, months) in loanYears">

角度可靠的下拉

1 个答案: