dhtmlx調度程序在角度上的碰撞檢測

Question

我已按照教程使調度程序以角度工作。我確實有一個問題。 人們只能通過我自己的形式添加事件，而不是通過調度器本身，因爲他們必須選擇要添加到事件中的圖像。

但是這使得scheduler.collision不起作用。我仍然可以在同一時間範圍內添加事件。另外如果我想覆蓋checkCollision方法，我會在控制檯中發現此方法未知的錯誤。

因爲我是Angular的新手，所以我不知道如何讓兩者合作。

我的調度指令：

myAppProfile.directive('dhxScheduler', function() { 
     return { 
     restrict: 'A', 
     scope: false, 
     transclude: true, 
     template:'<div class="dhx_cal_navline" ng-transclude></div><div class="dhx_cal_header"> 
         </div><div class="dhx_cal_data"></div>', 

     link:function ($scope, $element, $attrs, $controller){ 
      //default state of the scheduler 
      if (!$scope.scheduler) 
      $scope.scheduler = {}; 
      $scope.scheduler.mode = $scope.scheduler.mode || "month"; 
      $scope.scheduler.date = $scope.scheduler.date || new Date(); 

      //watch data collection, reload on changes 
      $scope.$watch($attrs.data, function(collection){ 
       if(collection) { 

      scheduler.clearAll(); 
      scheduler.parse(collection, "json"); 


      } 

      }, true); 

      //watch mode and date 
      $scope.$watch(function(){ 
      return $scope.scheduler.mode + $scope.scheduler.date.toString(); 
      }, function(nv, ov) { 
      var mode = scheduler.getState(); 

      if (nv.date != mode.date || nv.mode != mode.mode) 
       scheduler.setCurrentView($scope.scheduler.date, $scope.scheduler.mode); 
      }, true); 

      //size of scheduler 
      $scope.$watch(function() { 
      return $element[0].offsetWidth + "." + $element[0].offsetHeight; 
      }, function() { 
      scheduler.setCurrentView(); 
      }); 

      //styling for dhtmlx scheduler 
      $element.addClass("dhx_cal_container"); 

      //init scheduler 
      scheduler.config.xml_date="%Y-%m-%d %H:%i"; 
      scheduler.config.dblclick_create = false; 
      scheduler.config.drag_create = false; 
      scheduler.config.drag_move = true; 
      scheduler.config.readonly = false; 
      scheduler.config.touch= true; 
      scheduler.config.collision_limit = 1; //this does not give an error but does not work 
      scheduler.attachEvent("onEventLoading", function(ev){ //this gives error 
       return scheduler.checkCollision(ev);    
      }); 
      scheduler.init($element[0], new Date(), "month"); 
      scheduler.load("agendaController.php", "json"); 
      var dp = new dataProcessor("agendaController.php"); 
      dp.init(scheduler); 


     } 
     } 
}); 

調度save_event方法（通過PHP）：

myAppProfile.controller('addEventController', function($scope,$location, $http) { 
     $scope.saveEvent = function() { 
      $http({ 

        method: 'POST', 
        url: 'eventController.php', 
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
        data: { 
          'begin': $scope.begin + " " + $scope.btijd, 
          'einde': $scope.einde + " " + $scope.etijd, 
          'beschrijving': $scope.beschrijving, 
          'img': $scope.img 
         } 
       }). 

       success(function(data, status) { 

        $location.path("/agenda"); 

       }). 

       error(function(data, status) { 
        alert(data); 
       }); 
     } 
}); 

Answer 1

確保您加載轉/ dhtmlxscheduler_limit.js，如果沒有這個文件checkCollision方法不會定義。

此外，使用onEventLoading中的checkCollision代價很高（您將有n * n * n/4次檢查）。相反的，你可以使用像旁邊代碼之前將數據發送到服務器端

var id = scheduler.addEvent({ event object details here }) 
if (scheduler.getEvent(id)){ 
    //there is no collision, server side saving data call can be initiated 
} else { 
    //collision detected, event *not added*, show some message for the user 
}