diff --git a/src/directives/mwlCalendarDay.js b/src/directives/mwlCalendarDay.js
index a36fd006..92d86238 100644
--- a/src/directives/mwlCalendarDay.js
+++ b/src/directives/mwlCalendarDay.js
@@ -10,7 +10,7 @@ angular
 
     vm.$sce = $sce;
 
-    $scope.$on('calendar.refreshView', function() {
+    function refreshView() {
       vm.dayViewSplit = vm.dayViewSplit || 30;
       vm.dayViewHeight = calendarHelper.getDayViewHeight(
         vm.dayViewStart,
@@ -34,7 +34,15 @@ angular
         return !event.allDay;
       });
 
-    });
+    }
+
+    $scope.$on('calendar.refreshView', refreshView);
+
+    $scope.$watchGroup([
+      'vm.dayViewStart',
+      'vm.dayViewEnd',
+      'vm.dayViewSplit'
+    ], refreshView);
 
     vm.eventDragComplete = function(event, minuteChunksMoved) {
       var minutesDiff = minuteChunksMoved * vm.dayViewSplit;
diff --git a/test/unit/directives/mwlCalendarDay.spec.js b/test/unit/directives/mwlCalendarDay.spec.js
index 0ef44f3b..b32bba3b 100644
--- a/test/unit/directives/mwlCalendarDay.spec.js
+++ b/test/unit/directives/mwlCalendarDay.spec.js
@@ -31,6 +31,7 @@ describe('mwlCalendarDay directive', function() {
     vm.dayViewsplit = 30;
     vm.events = [
       {
+        $id: 0,
         title: 'An event',
         type: 'warning',
         startsAt: moment(calendarDay).startOf('week').subtract(2, 'days').add(8, 'hours').toDate(),
@@ -38,6 +39,7 @@ describe('mwlCalendarDay directive', function() {
         draggable: true,
         resizable: true
       }, {
+        $id: 1,
         title: '<i class="glyphicon glyphicon-asterisk"></i> <span class="text-primary">Another event</span>, with a <i>html</i> title',
         type: 'info',
         startsAt: moment(calendarDay).subtract(1, 'day').toDate(),
@@ -45,6 +47,7 @@ describe('mwlCalendarDay directive', function() {
         draggable: true,
         resizable: true
       }, {
+        $id: 2,
         title: 'This is a really long event title that occurs on every year',
         type: 'important',
         startsAt: moment(calendarDay).startOf('day').add(7, 'hours').toDate(),
@@ -138,4 +141,13 @@ describe('mwlCalendarDay directive', function() {
     expect(scope.events[0].tempStartsAt).to.eql(new Date(2015, 3, 24, 8, 30));
   });
 
+  it('should update the events when the day view split changes', function() {
+    scope.viewDate = moment(calendarDay).startOf('day').add(1, 'hour').toDate();
+    scope.$apply();
+    scope.$broadcast('calendar.refreshView');
+    scope.dayViewSplit = 15;
+    scope.$apply();
+    expect(MwlCalendarCtrl.nonAllDayEvents[0].height).to.equal(2040);
+  });
+
 });