javascript - ng-repeat 不创建标签

Question

我想动态生成一个相当无聊的<option> <select> 的时间列表,

<select>
  <option>8:00am</option>
  <option>8:15am</option>
  <option>8:30am</option>
  <option>8:45am</option>
  <option>9:00am</option>
  <option>9:15am</option>
  <option>...</option>
  <option>5:00pm</option>
</select>

我知道如何生成 session 记录，即

<option ng-repeat="minutes in ['00', 15, 30, 45]">8:{{minutes}}am</option>

显然我们需要几个小时的另一个循环，但这会在每四个 <option> 周围创建一组额外的标签。 s，这会破坏 <select> .

一个人怎么能 ngRepeat 不创建任何标签？

Answer 1

HTML:

<select>
    <option ng-repeat="h_m in [] track by $index | time:8:20:15">{{h_m}}</option>
</select>

AngularJS 过滤器:

angular.filter('time', function() {
    return function(input, from, to, interval) {
        from     = parseInt(from, 10);
        to       = parseInt(to, 10);
        interval = parseInt(interval, 10);

        for(var i=from, y=0; i<=to; ++i, y+=interval) {
            for(var y=0; y<60; y+=interval) {
                input.push(((i % 12) || 12)+ ":" + (y===0?'00':y) +" " + (i>12?'pm':'am'));
            }
        }

        return input;
    };
});

您可以设置开始时间、结束时间和时间间隔:

时间:start_hour:end_hour:间隔

start_hour 和 end_hour 必须是 24 时间格式

interval 以分钟为单位，应该在 1 到 59 之间..

测试一下 here .