Question

我正在开发一款能够按天跟踪活动的应用。这就是为什么我需要显示特定数量的复选框，其中包含日期旁边的日期。我有开始日期，并希望它随着每个复选框增加。因此，当开始日期是4月26日时，我应该在4月27日旁边的第二个复选框，28旁边的第三个复选框等。我创建了一个获取数据的服务（它从localStorage获取列表），可以使用表单添加新项目好吧，应该选择开始日期和检查框的数量。增加复选框旁边的日期的最佳方法是什么？现在我的模板看起来像这样：

<div class="to-check" ng-repeat="n in item.daysArray track by $index">
    <label><b>{{item.startDate}}</b></label>
    <input ng-change="$ctrl.refreshItem(item,$index)" ng-model="item.daysArray[$index]" type="checkbox">
</div>

我想有{{item.startDate}}现在的日期。这就是该模板的组件的样子：

controller: ['ListService', function (ListService) {
    this.listService = ListService;
    var list = localStorage.getItem('list');
    if (list != null && list.length >= 0) {
        var obj = JSON.parse(list);
        for (var i = 0; i < obj.length; i++) {
            obj[i].startDate = new Date(obj[i].startDate);
        }
        //console.log(obj);
        this.listService.saveList(obj);
    }

    this.addItem = function (newItem) {
        var item = {
            name: newItem.name,
            startDate: new Date(newItem.startDate),
            days: newItem.days,
            daysCompleted: 0
        };
        this.listService.addItem(item);
        this.save();
    };

    this.list = ListService.getList();
    this.refreshItem = function (item, index) {
        if (item.daysArray[index]) {
            item.daysCompleted++;
            this.save();
        } else {
            item.daysCompleted--;
            this.save();
        }

    };

    this.save = function () {
        var currentList = ListService.getList();
        localStorage.setItem('list', JSON.stringify(currentList));
    }
}]

如果您想了解我在寻找什么，这里是app demo https://joannabochynska.github.io/HabitTracker/app/#/。

在演示部分，我希望复选框只有日期而不是复选框。希望很清楚:)

Answer 1

js中日期操作的最佳方式是momentjs。

您可以通过以下方式将日期添加到日期：

// Will add n days to your date and return a js Date
moment(yourJsDate).add(n, 'days').toDate()

要将其用作指令，您可以使用angular-moment为日期添加天数。

<span>{{item.startDate | amAdd : $index : 'days' | amDateFormat:'amDateFormat:'dddd, MMMM Do YYYY, h:mm:ss a''}}</span>

Answer 2

Momentjs非常适合日期操作，但如果您只想以角度格式化日期，则不需要它。您可以使用日期过滤器。

您可以在此处查看示例：

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

AngularJS - 如何在ng-repeat中显示日期

2 个答案: