1

所以我有一个日历应用程序，现在用户选择开始/结束日期并单击更新日历。这会填充一个日历。但是，我在范围中包含新元素时遇到了麻烦。例如，我不想一次又一次地使用相同的函数从开始日期、周数、星期几等计算某个单元格的“单元格日期”，我想将单元格日期一次存储到其范围内并让其他人使用它。尽管进行了多次尝试，但不知何故我无法做到这一点。在下面的 JSFiddle 中，您会注意到每个日历单元格的右上角显示月份中的日期。但是，如果您更改日期，比如上个月，当月的天数会更新，但我在单元格中显示的“单元格日期”不会更新！

例如，以“2014 年 7 月 5 日星期六”为例。将日期更新为从 6 月 1 日开始，最右边的单元格仍然是“2014 年 7 月 5 日星期六”，尽管它的日期是 6 月 7 日！相关代码在“calcell”指令和“events”指令中。在 calcell 中，我将 celld 设置为 ng-init='celld=cellDate(num, start_dt, $index)'。然后在事件中我只是使用 {{celld}} 显示。我可以通过在事件中使用 cellDate(num, start_dt, $index) 来让它工作，但我真的不想在任何地方都使用相同的函数一百万次。有没有办法可以将单元格日期存储在单元格对象中，并在子范围内使用它并在数据更改时更新？最终，我会将单元格日期传递给函数以获取该日期的事件数据，然后事件将遍历它们以显示事件数据。

小提琴链接

app.directive("events", function($compile, DateService) {
        return {
            restrict: "A",
            replace: true,
            scope: true,
            template: 
                    "<div>{{celld}}</div>",
            link: function(scope, element, attrs) {
                scope.DateService = DateService;
            }
        }
    });

    //calendar cell 
    app.directive("calcell", function($compile, DateService) {
        return {
            restrict: "A", 
            replace: true, 
            scope: true,
            template: 
                "<td ng-init='celld=cellDate(num, start_dt, $index)' id='{{\"td\" + DateService.getDateInt(cellDate(num, start_dt, $index))}}' \
                        realclass='{{getScopeClass(cellDate(num, start_dt, $index))}}'>\
                    <div>\
                        <a class='CellDay'>{{DateService.getMonthDay(cellDate(num, start_dt, $index))}}</a>\
                    </div>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <div events></div>\
                    </div>\
                </td>",
            link: function(scope, element, attrs) {                 
                scope.DateService = DateService;
            }
        }
    });

谢谢！

4

1 回答 1

0

通过将单元格放在事件标签上，我能够使其工作。不确定这是否有帮助。

<div events ng-attr-celld='{{cellDate(num, start_dt, $index)}}'></div>

无需替换它，attr 是范围值。

//replace: true,
...
scope: {celld:'@'}

小提琴

如果您还没有看过 -角度 ui 日历- 可能会为您节省一些时间。

于 2014-08-01T00:45:30.830 回答