使用AngularJS上的nd-repeat创建代表未来20年的数字的下拉菜单的

发布时间：2020-12-17 18:00:17 所属栏目：安全来源：网络整理

导读：使用AngularJS上的nd-repeat创建代表未来20年的数字的下拉菜单的最佳方法是什么？动态地获得第一年(当前年份)会很好. 那么使用迭代器来减少一年中的月份(1..12)呢？注意：我在这里找到了一个好主意： http://www.zzzxo.com/q/answers-angularjs-for-loop-w

使用AngularJS上的nd-repeat创建代表未来20年的数字的下拉菜单的最佳方法是什么？动态地获得第一年(当前年份)会很好.

那么使用迭代器来减少一年中的月份(1..12)呢？

注意：
我在这里找到了一个好主意：
http://www.zzzxo.com/q/answers-angularjs-for-loop-with-numbers-ranges-11873570.html

但是,我想知道是否有更短的方式.

解决方法

这将是创建可重用性指令的好机会.这是多年来的一个例子,同样类型的事情可以持续数月.使用ng-options代替ng-repeat.

HTML：

<div year-drop offset="0" range="20"></div>

指示：

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>'
    }
});

Here is a fiddle

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!