refactor(modal): trigger resize event on the window when modal opens

A better approach to resolving an issue with collection-repeat sizing itself properly. This keeps directives independent of eachother.
ionic-team · Jul 24, 2014 · 4f6d02c · 4f6d02c
1 parent 1fbd3c5
commit 4f6d02c
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 23 deletions.
diff --git a/js/angular/directive/collectionRepeat.js b/js/angular/directive/collectionRepeat.js
@@ -225,11 +225,6 @@ function($collectionRepeatManager, $collectionDataSource, $parse) {
         rerender($scope.$eval(listExpr));
       }
 
-      // for lists inside a modal, recalc when the modal is shown
-      $scope.$on('modal.shown',function(){
-        onWindowResize();
-      });
-
       ionic.on('resize', onWindowResize, window);
 
       $scope.$on('$destroy', function() {

diff --git a/js/angular/service/modal.js b/js/angular/service/modal.js
@@ -148,6 +148,7 @@ function($rootScope, $document, $compile, $timeout, $ionicPlatform, $ionicTempla
 
       $timeout(function(){
         modalEl.addClass('ng-enter-active');
+        ionic.trigger('resize');
         self.scope.$parent && self.scope.$parent.$broadcast('modal.shown', self);
         self.el.classList.add('active');
       }, 20);

diff --git a/test/unit/angular/directive/collectionRepeat.unit.js b/test/unit/angular/directive/collectionRepeat.unit.js
@@ -152,24 +152,6 @@ describe('collectionRepeat directive', function() {
     expect(scrollView.resize.callCount).toBe(1);
   });
 
-  it('should rerender on modal popup', function() {
-    inject(function($rootScope) {
-      var el = setup('collection-repeat="item in items" collection-item-height="50"');
-      var scrollView = el.controller('$ionicScroll').scrollView;
-      spyOn(scrollView, 'resize');
-      dataSource.setData.reset();
-      repeatManager.resize.reset();
-
-      el.scope().items = [1, 2, 3];
-
-      $rootScope.$broadcast('modal.shown');
-
-      expect(dataSource.setData).toHaveBeenCalledWith(el.scope().items);
-      expect(repeatManager.resize.callCount).toBe(1);
-      expect(scrollView.resize.callCount).toBe(1);
-    });
-  });
-
   it('$destroy', function() {
     var el = setup('collection-repeat="item in items" collection-item-height="50"');
     dataSource.destroy = jasmine.createSpy('dataSourceDestroy');

diff --git a/test/unit/angular/service/modal.unit.js b/test/unit/angular/service/modal.unit.js
@@ -48,6 +48,14 @@ describe('Ionic Modal', function() {
     expect(instance.isShown()).toBe(false);
   });
 
+  it('should trigger a resize event', function() {
+    var instance = modal.fromTemplate('<div class="modal">hello</div>');
+    spyOn(ionic, 'trigger');
+    instance.show();
+    timeout.flush();
+    expect(ionic.trigger).toHaveBeenCalledWith('resize');
+  });
+
   it('should set isShown on remove', function() {
     var instance = modal.fromTemplate('<div class="modal">hello</div>');
     expect(instance.isShown()).toBe(false);