Javascript 在AngularJS上使用nd repeat创建数字代表未来20年的下拉列表的最佳方法是什么?

Javascript 在AngularJS上使用nd repeat创建数字代表未来20年的下拉列表的最佳方法是什么?,javascript,html,angularjs,angularjs-directive,ng-options,Javascript,Html,Angularjs,Angularjs Directive,Ng Options,使用AngularJS上的ng repeat创建代表未来20年的数字下拉列表的最佳方法是什么?最好动态地获取第一年(当前年份) 那么,使用迭代器对一年中的月份(1..12)进行下拉怎么样 注: 我在这里发现了一个好主意: 然而,我想知道是否有一条更短的路。我认为这样的事情非常简单 控制器: $scope.years = [2013, 2014, 2015...] var year = new Date().getFullYear(); var range = []; range.push(y

使用AngularJS上的
ng repeat
创建代表未来20年的数字下拉列表的最佳方法是什么?最好动态地获取第一年(当前年份)

那么,使用迭代器对一年中的月份(1..12)进行下拉怎么样

注: 我在这里发现了一个好主意:


然而,我想知道是否有一条更短的路。

我认为这样的事情非常简单

控制器:

$scope.years = [2013, 2014, 2015...]
var year = new Date().getFullYear();
var range = [];
range.push(year);
for(var i=1;i<20;i++) {
  range.push(year + i);
}
$scope.years = range;
var range = [];
for(var i=1;i<13;i++) {
  range.push(i);
}
$scope.months = range;
视图:


您可以首先将当前年份作为Javascript日期对象,然后使用for循环查找接下来的十九个连续年份。然后,将它们作为数组传递给视图

控制器:

$scope.years = [2013, 2014, 2015...]
var year = new Date().getFullYear();
var range = [];
range.push(year);
for(var i=1;i<20;i++) {
  range.push(year + i);
}
$scope.years = range;
var range = [];
for(var i=1;i<13;i++) {
  range.push(i);
}
$scope.months = range;
var year=newdate().getFullYear();
var范围=[];
射程.推力(年);

对于(var i=1;i这将是一个创建可重用性指令的好机会。这里是一个多年的示例,相同类型的事情可以做几个月。使用
ng options
而不是
ng repeat

HTML:


指令:

angular.module('myapp',[]).directive('yearDrop',function(){
    function getYears(offset, range){
        var currentYear = new Date().getFullYear();
        var years = [];
        for (var i = 0; i < range + 1; i++){
            years.push(currentYear + offset + i);
        }
        return years;
    }
    return {
        link: function(scope,element,attrs){
            scope.years = getYears(+attrs.offset, +attrs.range);
            scope.selected = scope.years[0];
        },
        template: '<select ng-model="selected" ng-options="y for y in years"></select>'
    }
});
angular.module('myapp',[]).directive('yearDrop',function(){
函数getYears(偏移量,范围){
var currentYear=新日期().getFullYear();
风险值年数=[];
对于(变量i=0;i

这将是您的视图部分

<select ng-options="month as month.title for month in proficiencyMatrixCtrl.months track by month.id" ng-model="<your controller_name>.currentMonth" 
ng-change="<your_controller>.<your_controller_inside_function()">
</select>

我想你们是对的。这方面没有现成的解决方案。所以考虑到答案,我认为sh0ber有最好的主意,得到Jakemmarsh建议的数字范围,并将其放入指令中,使其可重复使用。谢谢你们!回答得很好。通过这种方法,如何动态指定ng模型?@ChrisLandeza:re添加指令以了解如何在包含作用域/控制器内传入和绑定模型。您需要使用
scope:{}
属性在指令的
return
对象中指定绑定。您可以。您也可以在没有角度指令的情况下执行此操作。在角度控制器中使用函数如何在函数中包装控制器逻辑并在选择元素中使用它
console.log($scope.currentCurrent);