完整的日历与所需的JS + Angular AMD

Question

以前，我只使用带fullcalendar的angular js，那时所有带有data-calendar-view属性的菜单动作菜单都在工作。

'<ul class="actions actions-alt" id="fc-actions">' +
        '<li class="dropdown" dropdown>' +
        '<a href="" dropdown-toggle><i class="zmdi zmdi-more-vert"></i></a>' +
        '<ul class="dropdown-menu dropdown-menu-right">' +
        '<li class="active">' +
        '<a data-calendar-view="month" href="">Month View</a>' +
        '</li>' +
        '<li>' +
        '<a data-calendar-view="basicWeek" href="">Basic Week View</a>' +
        '</li>' +
        '<li>' +
        '<a data-calendar-view="agendaWeek" href="">Full Week View</a>' +
        '</li>' +
        '<li>' +
        '<a data-calendar-view="basicDay" href="">Basic Day View</a>' +
        '</li>' +
        '<li>' +
        '<a data-calendar-view="agendaDay" href="">Full Day View</a>' +
        '</li>' +
        '</ul>' +
        '</div>' +
        '</li>';

我在打电话

  $('#calendar').fullCalendar('changeView', attrs.calendarView);

该函数在指令中。

但在那之后，我修改了我的项目，并在其中添加requiredjs和angular AMD，以便在需要时加载js。

所有其他代码保持不变，日历在UI中加载，但函数没有执行，甚至没有抛出任何错误。

请帮帮我。

Answer 1

所提供的代码不足以为您提供完整的答案，但是对于以这种方式失败的代码，只有几个选项

1. 你的指令没有渲染，所以$('#calendar').fullCalendar('changeView', attrs.calendarView);根本没有被调用

检查该指令是否在开发人员工具断点或穷人调试中执行- console.log如果它是应该调用该函数的指令模板，那么确保在指令的link方法中进行，因为它被称为post渲染

你的指令被渲染，但$('#calendar').fullCalendar('changeView', attrs.calendarView);被调用之前#calendar出现在DOM，

在执行fullCalendar之前检查$('#calendar')是否存在$('#calendar')将返回jQuery对象没有任何元素和fullCalendar将调用没有抛出错误，如果它是DOM竞速问题，然后做:

$timeout(function(){
    $('#calendar').fullCalendar('changeView', attrs.calendarView);
});

应该有助于在$timeout中执行此片段，将其调度到下一个$digest调用