2015-03-03 22 views
5

Tôi đang sử dụng góc cạnh và toàn bộ lịch biểu. Tôi có (bất ngờ) vấn đề múi giờ, và tôi dường như không thể làm đúng.Fullcalendar sai thời gian trong sự kiện nhấp chuột

Nếu trong chế độ xem theo tuần, tôi nhấp vào 08.00 giờ, tôi mở một phương thức và hiển thị thời gian, tôi thấy 09.00 giờ.

timezone: "Europe/Brussels", 
ignoreTimezone: false, 

Đây là (atm) một +0100 múi giờ, và trong suốt mùa hè một 0200 múi giờ

Cú click-event:

dayClick: function (date, jsEvent, view) { 

    $scope.newEventDate = date; 

    var modalInstance = $modal.open({ 
     templateUrl: 'newRosterEvent', 
     controller: 'NewEventModalController', 
     backdrop: "true", 
     resolve: { 
      event: function() { 
         return $scope.newEventDate; 
        }, 
      stage: function() { 
         return $scope.stage; 
        } 
      } 
     }); 

Để hiển thị thời gian:

stagewebApp.controller('NewEventModalController', ["$scope", "$modalInstance","$filter", "event", "stage", function ($scope, $modalInstance, $filter,event, stage) { 

    $scope.stage = stage; 

    $scope.day = new Date($filter('date')(event._d, "yyyy-MM-dd")); 

    $scope.start = event.toDate(); 

    ....more code.... 
} 

Trong trường hợp này $ scope.start hiển thị thời gian đã nhấp +1

Vì vậy, có vẻ như fullcalendar mất thời gian tôi đã nhấp và chuyển đổi nó thành múi giờ đã chọn, nhưng tôi hy vọng nó sẽ giải thích thời gian được nhấp vào trong múi giờ tôi đã chọn.

Dường như tôi đang giải quyết vấn đề này sai, vậy cách chính xác để làm điều này là gì? ($scope.start sẽ hiển thị thời gian tôi đã nhấp (tốt nhất là trong múi giờ của tôi)). Sau đó tôi gửi nó đến máy chủ nơi nó được lưu trữ dưới dạng UTC.

Trả lời

5

Phiên bản hiện tại của FullCalendar sử dụng rộng rãi moment.js. Các vấn đề bạn mô tả là do sử dụng không đúng các đối tượng moment. Cụ thể là:

$scope.start = event.toDate(); 

Khi bạn gọi toDate, bạn trở lại thường xuyên đối tượng JavaScript Date - mà sẽ được dựa trên UTC cùng ngay lập tức, nhưng sẽ luôn mất trên hành vi của các múi giờ đang ở đâu đang chạy. Bạn có một vài lựa chọn:

  • Bạn có thể giữ nó như là một đối tượng moment:

    $scope.start = event; 
    
  • Bạn có thể định dạng nó thành một chuỗi ISO mà vẫn giữ được múi giờ bù đắp:

    $scope.start = event.format(); // ex: '2015-03-04T08:00:00+01:00' 
    

Với một trong hai tùy chọn, bạn sẽ cần phải làm theo thông qua việc sử dụng của $scope.start để mong đợi một hoặc moment hoặc một chuỗi, chứ không phải là Date.

Ngoài ra, trong mã này:

$scope.day = new Date($filter('date')(event._d, "yyyy-MM-dd")); 

Bạn không bao giờ nên truy cập vào _d sở hữu trực tiếp, như có thể có ngoài ý muốn tác dụng phụ. Xem xét dấu gạch dưới có nghĩa là "nội bộ". Ngoài ra, bạn không cần bộ lọc ngày của Angular ở đây vì các đối tượng thời gian có khả năng định dạng. Thay vào đó, chỉ cần thực hiện việc này:

$scope.day = event.format("YYYY-MM-DD"); 
Các vấn đề liên quan