javascript 在 AngularJS 上使用 nd-repeat 创建代表未来 20 年的数字的下拉菜单的最佳方法是什么?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17052967/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is the best way to create drop downs with numbers representing the next 20 years using nd-repeat on AngularJS?
提问by Fabio Nolasco
What is the best way to create drop downs with numbers representing the next 20 years using ng-repeat
on AngularJS? It would be good to get the first year (the current year) dynamically.
ng-repeat
在 AngularJS 上使用代表未来 20 年的数字创建下拉菜单的最佳方法是什么?动态获取第一年(当前年份)会很好。
And what about a drop down with the months of the year (1..12) using the iterator?
那么使用迭代器下拉一年中的月份 (1..12) 怎么样?
NOTE: I found a good idea here: http://www.zzzxo.com/q/answers-angularjs-for-loop-with-numbers-ranges-11873570.html
注意:我在这里找到了一个好主意:http: //www.zzzxo.com/q/answers-angularjs-for-loop-with-numbers-ranges-11873570.html
However, I wonder if there is a shorter way.
但是,我想知道是否有更短的方法。
回答by Dan
This would be a good opportunity to create a directive for reusability. Here is an example for years, and the same type of thing could be done for months. Use ng-options
instead of ng-repeat
.
这将是创建可重用性指令的好机会。这是一个多年的例子,同样的事情可以做几个月。使用ng-options
代替ng-repeat
。
HTML:
HTML:
<div year-drop offset="0" range="20"></div>
Directive:
指示:
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>'
}
});
回答by Jakemmarsh
You could first get the current year as a Javascript date object, then use a for loop to find the next nineteen sequential years. Then, pass these as an array to the view.
您可以首先将当前年份作为 Javascript 日期对象,然后使用 for 循环查找接下来的 19 个连续年份。然后,将这些作为数组传递给视图。
Controller:
控制器:
var year = new Date().getFullYear();
var range = [];
range.push(year);
for(var i=1;i<20;i++) {
range.push(year + i);
}
$scope.years = range;
View:
看法:
<select ng-options="year for year in years">
</select>
and if I understand you correctly, a similar approach to make a months dropdown controller:
如果我对你的理解正确的话,一个类似的方法来制作一个月份的下拉控制器:
var range = [];
for(var i=1;i<13;i++) {
range.push(i);
}
$scope.months = range;
回答by Terry
I would think something like this is pretty straightforward
我认为这样的事情很简单
Controller:
控制器:
$scope.years = [2013, 2014, 2015...]
View:
看法:
<select ng-options="year for year in years">
</select>
回答by tech share
This will be your view part
这将是您的视图部分
<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>
Need to get value in the controller function by using below syntax:
需要使用以下语法在控制器函数中获取值:
console.log($scope.currentCurrent);