diff --git a/src/components/virtualRepeat/virtual-repeater.js b/src/components/virtualRepeat/virtual-repeater.js index 073a1587021..ed5eb401dbe 100644 --- a/src/components/virtualRepeat/virtual-repeater.js +++ b/src/components/virtualRepeat/virtual-repeater.js @@ -132,19 +132,26 @@ function VirtualRepeatContainerController( // make a best effort at re-measuring as it changes. var boundUpdateSize = angular.bind(this, this.updateSize); - $$rAF(function() { + $$rAF(angular.bind(this, function() { boundUpdateSize(); var debouncedUpdateSize = $mdUtil.debounce(boundUpdateSize, 10, null, false); var jWindow = angular.element($window); + // Make one more attempt to get the size if it is 0. + // This is not by any means a perfect approach, but there's really no + // silver bullet here. + if (!this.size) { + debouncedUpdateSize(); + } + jWindow.on('resize', debouncedUpdateSize); $scope.$on('$destroy', function() { jWindow.off('resize', debouncedUpdateSize); }); $scope.$on('$md-resize', boundUpdateSize); - }); + })); } @@ -187,6 +194,7 @@ VirtualRepeatContainerController.prototype.updateSize = function() { this.size = this.isHorizontal() ? this.$element[0].clientWidth : this.$element[0].clientHeight; + this.repeater && this.repeater.containerUpdated(); }; diff --git a/src/components/virtualRepeat/virtual-repeater.spec.js b/src/components/virtualRepeat/virtual-repeater.spec.js index 69902d03a83..833acad5db5 100644 --- a/src/components/virtualRepeat/virtual-repeater.spec.js +++ b/src/components/virtualRepeat/virtual-repeater.spec.js @@ -582,6 +582,30 @@ describe('', function() { expect(offsetter.children().length).toBe(43); }); + it('makes a second attempt to measure the size if it starts out at 0', + function() { + var debounced; + spyOn($mdUtil, 'debounce').and.callFake(function(fn) { + debounced = fn; + }); + + // Create the repeater before appending it to the body. + scope.items = createItems(100); + component = $compile(container)(scope); + $material.flushOutstandingAnimations(); + angular.element($document[0].body).append(container); + offsetter = angular.element(component[0].querySelector('.md-virtual-repeat-offsetter')); + + // Expect 3 children (0 + 3 extra). + expect(offsetter.children().length).toBe(3); + + // Expect it to remeasure using debounce. + debounced(); + + // Expect 13 children (10 + 3 extra). + expect(offsetter.children().length).toBe(13); + }); + /** * Facade to access transform properly even when jQuery is used; * since jQuery's css function is obtaining the computed style (not wanted) @@ -589,6 +613,4 @@ describe('', function() { function getTransform(target) { return target[0].style.webkitTransform || target.css('transform'); } - - });