当使用 ng-show 隐藏日历时，如何更新 angularjs fullcalendar

Question

当我向事件源添加元素时，双向绑定似乎只在日历可见时才起作用。隐藏日历时如何使双向绑定起作用？

Html

<div id="timeOffBody" class="region-calendar" ng-show="!isBottomPanelVisible()">
    <div ui-calendar="uiConfig.calendar" calendar="topCalendar" class="calendar" ng-model="eventSources"></div>
</div>

相关JS

    $scope.existingRequests = [];
    $scope.pendingRequests = [];
    $scope.eventSources = [$scope.existingRequests, $scope.pendingRequests];
    $scope.addNewRequestToPendingArray = function (request) {
        $scope.pendingRequests.push(request);
    };
   $scope.isBottomPanelVisible = function () {
        return (($scope.selectedStart != null) && ($scope.selectedEnd != null));
    }

这是一个plunker。在 plunker 示例中，您可以看到日历仅在其容器可见时更新，但即使在隐藏时也会添加事件范围数组。

Answer 1

我刚刚试过了。是因为UI日历使用了fullcalendar.js并且不在AngularJS地区，所以隐藏时不起作用。

这是plunker

这个想法很简单。注入 uiCalendarConfig 到你的控制器

并像 uiCalendarConfig.calendars.myCalendar.fullCalendar( 'removeEventSource', $scope.events )

一样使用它

当使用 ng-show 隐藏日历时，如何更新 angularjs fullcalendar

how do I update angularjs fullcalendar when the calendar is hidden with ng-show

fullcalendar

angularjs