fix(collectionRepeat): properly display collection repeat inside a modal

ionic-team · Jul 24, 2014 · 1fbd3c5 · ajoslin · Jul 24, 2014 · perrygovier
1 parent 4e6ba5b
commit 1fbd3c5
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 0 deletions.
diff --git a/js/angular/directive/collectionRepeat.js b/js/angular/directive/collectionRepeat.js
@@ -225,6 +225,11 @@ 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/test/unit/angular/directive/collectionRepeat.unit.js b/test/unit/angular/directive/collectionRepeat.unit.js
@@ -152,6 +152,24 @@ 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');