AngularJS和Fullcalendar:eventClick仅适用于第一次

时间:2013-05-18 19:58:56

标签: javascript angularjs fullcalendar

我正在使用基于fullcalendar的Angular模块:https://github.com/angular-ui/ui-calendar以及ng-bootstrap中的对话框模块。我将日历配置为显示一个对话框,用于在eventClick操作上编辑事件。它只能工作一次。关闭第一个对话框并再次单击任何事件后,新对话框不会显示。但是,当我点击页面上的任何其他链接时,所有想要的对话框都会逐个显示,就像它们在某处某处排队一样。

这是我的控制器的片段:

 $scope.showEditVisitDialog = function (event) {
    var editVisitDialogOpts = {
        backdropClick: false,
        templateUrl: 'views/addEditVisitDialog.html',
        controller: 'AddEditVisitDialogController',
        resolve: {
            patientId: function () {
                return event.patientId;
            },
            visitId: function () {
                return event.id;
            }
        }
    };
    var editVisitDialog = $dialog.dialog(editVisitDialogOpts);
    editVisitDialog.open().then(function (updatedVisit) {
    //some action
    });
};


$scope.calendar = {
    height: 450,
    editable: true,
    header: {
        left: 'month agendaWeek ',
        center: 'title',
        right: 'today prev,next'
    },
    eventClick: $scope.showEditVisitDialog
};
$scope.events = [];
$scope.eventSources = [$scope.events]

稍后在控制器中从REST获取事件。

在html中:     <div ui-calendar="calendar" config="calendar" ng-model="eventSources"/>

控制台没有错误,我做错了什么?

关于plunker的代码:http://plnkr.co/edit/89sQfsU85zN4uxauFI2Y?p=preview

2 个答案:

答案 0 :(得分:4)

与往常一样,当有小提琴/ plnkr可用时,事情变得更简单,更明显。您需要在$ apply函数中调用showEditVisitDialog

...
$scope.calendar = {
  editable: true,
  eventClick: function(){
    $scope.$apply(function(){
      $scope.showEditVisitDialog()
    });
  }
};
...

工作plnkr

答案 1 :(得分:2)

你需要在uiConfig之前为日历声明你的功能;)