Question

我很多天都面临着这场噩梦，我仍然无法想象我缺少什么让changeView事件发挥作用。

我在做什么？我正在以编程方式尝试更改日历的视图。怎么样？通过控制器中的id搜索fullcalendar并设置新视图。

很多指南/主题讲述了很多方面，但我得到的更容易理解的是：

这是我的HTML代码（它是整个HTML页面）：

<div class="container">
  <div id="eventsCalendar" ui-calendar="main.uiConfig.calendar" class="span8 calendar" ng-model="main.eventSources">
  </div>
</div>

这是如何获取日历，在控制器中设置新视图：

angular.element('#eventsCalendar').fullCalendar('changeView', 'agendaView');

它看起来很好，没有错误和角度得到日历（耶！）。惊人！没有注入“与日历相关的依赖关系”，这是一种非常简单而简短的方式......真是太棒了！用这行代码设置一个函数，但什么都没发生，日历仍然在月视图中（神圣该死的......回到绘图板......）

ui-calendar的某些线程（可能类似于fullcalendar？）告诉注入uiCalendarConfig作为控制器的依赖关系，在HTML声明中声明calendar="myCalendar"属性并调用uiCalendarConfig.calendars.myCalendar ......结果是：uiCalendarConfig是空的......我很困惑。

有没有人能让changeView正常工作？我怎么能这样做？我确定我错过了一些愚蠢的东西......我能感觉到它！

任何帮助将不胜感激。

Answer 1

index.html

要更改日历视图，请使用此功能

<div calendar="eventsCalendar" ui-calendar="main.uiConfig.calendar" class="span8 calendar" ng-model="main.eventSources">

调用下面的函数

$scope.changeView = function(view) {
   uiCalendarConfig.calendars["eventsCalendar"].fullCalendar('changeView',view);
};

Answer 2

不幸的是，似乎没有onload回调。但是，这是我为我的应用程序提出的

    // watcher for on load
    var calendarOnLoad = null;
    var calendarOnLoadCallbacks = [];

    $scope.changeView = function(view) {

        if(uiCalendarConfig.calendars.eventsCalendar) {
            // already initiated or beat the race condition, great!
           uiCalendarConfig.calendars.eventsCalendar.fullCalendar('changeView',view);
        }
        else {
            // calendar is undefined. watch for onload
            if(!calendarOnLoad) {
                calendarOnLoad = $scope.$watch(function () {
                    // prevent type error which breaks the app
                    try {
                        return uiCalendarConfig.calendars.eventsCalendar;
                    } catch (err) {
                        return null;
                    }
                }, function (calendar) {
                    // uiCalendarConfig.calendars.eventsCalendar is now initiated
                    if(calendar) {
                        calendarOnLoad(); // clear watcher since calendar exists
                        // call all the callbacks queued
                        calendarOnLoadCallbacks.forEach(function (fn) {
                            fn(calendar);
                        });
                    }
                });
            }

            // run this calendarOnLoadCallbacks queue once calendar is initiated
            calendarOnLoadCallbacks.push(function(calendar) {
                calendar.fullCalendar('changeView',view);
            });

        }
    }


    $scope.changeView('agendaWeek');
    $scope.changeView('month');
    $scope.changeView('agendaDay');

我希望这会有所帮助。

查看更改fullcalendar不起作用

2 个答案: