Question

所以我有一个日历应用程序，用户现在可以选择开始/结束日期并点击更新日历。这会填充日历。但是，我在范围内包含新元素时遇到了麻烦。例如，不是一遍又一遍地使用相同的函数来计算＆＃34;单元格日期＆＃34;对于某些单元格，从开始日期，周数，星期几等，我想将单元格日期存储到其范围内，让其他人使用它。尽管经过多次尝试，我还是无法做到这一点。在下面的JSFiddle中，您会注意到每个日历单元格右上角显示的月份日期。但是，如果您更改日期，例如更改前一个月，那么该月的日期会更新，但是＆＃34;单元格日期＆＃34;我在单元格中显示不更新！

例如，参加＆＃34; 2014年7月5日星期六＆＃34;。更新日期从6/1开始，最右边的单元格仍然是＃34; 2014年7月5日星期六＆＃34;即使它的一天反映了6月7日！相关代码在＆＃34; calcell＆＃34;指令和＆＃34;事件＆＃34;指示。在calcell中，我将celld设置为ng-init =＆lt; celld = cellDate（num，start_dt，$ index）＆＃39;。然后在事件中我只使用{{celld}}显示。我可以通过在事件中使用cellDate（num，start_dt，$ index）来使其工作，但我真的不想在任何地方使用相同的功能一百万次。有没有办法可以将单元格日期存储在单元格对象中，只需在子范围内使用它，并在数据更改时更新它？最后，我将把单元格日期传递给函数以获取该日期的事件数据，然后事件将迭代它们以显示事件数据。

fiddle link

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;
            }
        }
    });

谢谢！

Answer 1

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

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

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

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

fiddle

如果您还没有看过 - angular ui calendar - 可能会为您节省一些时间。

数据更改时的angularjs和ng-init范围

1 个答案: