如何在角度js的范围之间重复选项[重复]答案

【问题标题】：how to repeat option between a range in angular js [duplicate]如何在角度js的范围之间重复选项[重复]
【发布时间】：2014-06-03 18:11:42
【问题描述】：

我想用 Angular js 打印 2014-2050。我试图在 google 和 SO 中找到它，我得到了下面

<select class="form-control" >
<option  ng-repeat="n in [2014,2015,2016, .. 2050]" value="{{n}}">
    {{n}}
</option>                               
</select>

我目前正在学习 Angular js。我想在定义的范围之间运行一个循环？就像在 php 中一样，如果我想在 2014-2050 之间运行一个循环，我会这样做

for($i=2014;$i<=2050;$i++)
{
  echo $i;
}

如何在 Angular js 中运行上述 for 循环。请帮我。

【问题讨论】：

你的问题不清楚。您能否详细说明您的问题？
@AbhishekPrakash 我已经更新了我的问题。请看。
顺便说一句，您可以在选择中使用ngOptionsdocs.angularjs.org/api/ng/directive/select，而不是ngRepeat。
这个问题与这些 SO 中的任何一个都不重复。而这些答案都不是正确答案。谢谢你帮助我。
你能在你的问题中澄清它与可能的重复有什么不同吗？

标签： javascript angularjs

【解决方案1】：

角度文档中未提及，但您可以使用 limitTo 过滤器两次来分割数组/对象中的范围。

https://docs.angularjs.org/api/ng/filter/limitTo

就这么简单：

<li ng-repeat="item in items | limitTo:10 | limitTo:-5">{{item}}</li>

工作演示：http://plnkr.co/edit/8LXXnH?p=preview

【讨论】：

【解决方案2】：

在此处使用自定义过滤器。

<div ng-app='myApp' ng-controller="Main">
    <li ng-repeat="date in [] | range:2050">{{date}}</li>
</div>

var myApp = angular.module('myApp', []);
myApp.filter('range', function() {
  return function(input, total) {
    total = parseInt(total);
    for (var i=2014; i<=total; i++)
      input.push(i);
    return input;
  };
});

【讨论】：

【解决方案3】：

您必须在控制器中创建范围并使用ng-repeat 或ng-options。 ng-options 更好。

angular.module('app', [])
.controller('MyController', function($scope) {
    var years = [];
    for (var i = 2014; i <= 2050; i++) {
       years.push(i);
    }
    $scope.years = years;
});

HTML

<select class="form-control" >
    <option  ng-repeat="year in years" value="{{year}}">
        {{n}}
    </option>
</select>

（或）你可以使用 ng-options

<select ng-model="selectedYear" ng-options="year for year in years"></select>

【讨论】：

在投反对票之前，请澄清

【解决方案4】：

最好在控制器中初始化日期数组（甚至更好，在服务中），然后在模板中循环预先创建的数组。所以在控制器中：

$scope.dates = [];

var initDates = function() {
  var i;
  for (i = 2014;i <= 2050; i++) {
    $scope.dates.push(i);
  }
}

initDates();

然后在模板中：

ng-repeat="date in dates"

可以在http://plnkr.co/edit/9K9VhAAM9HxopDlCVLi9?p=preview看到

【讨论】：

我在 SO 中看到过这个。但我不认为这是一个正确的过程。
你能解释一下为什么你认为它不正确吗？
在投反对票之前，请澄清
@FizerKhan 我不能投反对票。
我正在尝试查找是否有其他方法可以做到这一点。因为这是一个漫长的过程