well .. to answer you question :
you can allow scrolling in the reverse direction of md-virtual-repeat by changing the body tag of your html document to <body dir="rtl">
a quick rundown :
i looked for this everywhere but i couldn't find anything and i assume you did too, so i downloaded angular-material.js from angular cdn locally to see how they handle this, here's a snippet :
VirtualRepeatContainerController.prototype.handleScroll_ = function() {
var ltr = document.dir != 'rtl' && document.body.dir != 'rtl';
if(!ltr && !this.maxSize) {
this.scroller.scrollLeft = this.scrollSize;
this.maxSize = this.scroller.scrollLeft;
}
var offset = this.isHorizontal() ?
(ltr?this.scroller.scrollLeft : this.maxSize - this.scroller.scrollLeft)
: this.scroller.scrollTop;
if (offset === this.scrollOffset || offset > this.scrollSize - this.size) return;
var itemSize = this.repeater.getItemSize();
if (!itemSize) return;
var numItems = Math.max(0, Math.floor(offset / itemSize) - NUM_EXTRA);
var transform = (this.isHorizontal() ? 'translateX(' : 'translateY(') +
(!this.isHorizontal() || ltr ? (numItems * itemSize) : - (numItems * itemSize)) + 'px)';
this.scrollOffset = offset;
this.offsetter.style.webkitTransform = transform;
this.offsetter.style.transform = transform;
if (this.bindTopIndex) {
var topIndex = Math.floor(offset / itemSize);
if (topIndex !== this.topIndex && topIndex < this.repeater.getItemCount()) {
this.topIndex = topIndex;
this.bindTopIndex.assign(this.$scope, topIndex);
if (!this.$rootScope.$$phase) this.$scope.$digest();
}
}
this.repeater.containerUpdated();
};
this is how i found that they rely on the body's direction to direct the infinit scrolling, so if you don't want to change the direction of your html document, you'll have to download it, edit this part and use it instead of the cdn , however .. it won't work as expected;
in normal situation, scrolling from left to right will increment the this.scrollLeft variable and as you can see in the snippet it's used everywhere, it will increment the offset and the translateX() and everything will fall into the right place,
but if you're scrolling from right to the left, the handleScroll_ function will set the this.scrollOfsset to the width of the view and as you scroll to left, this.scrollLeft will decrease instead of increasing and once you reach the end of your first 25 everything will break apart,
i tried console.log of all the variables inside and compared the rtl with the ltr to see when and where things break, i tried to play around with the values and operations but no success, feel free to do the same and experiment maybe i missed something ( but hey, the question is only about changing the direction right ? :P )
i would recommend you to go for something else ( like the ones in the comments above )
i hope this helps or at least gives you an idea, good luck.
EDIT :
since this depends on the body's direction, you can either scroll left or right, not both, even if you set md-top-index and start in the middle ( withdir="ltr" ) , you'll only have infinit scrolling on one side ( to the right ) if you go back, it's just displaying old already loaded data,
you can take a look at VirtualRepeatController.prototype.virtualRepeatUpdate_ inside the js file to see how it adds the new blocks and update indexes and the scroll.
on a side note: people wanted this for reverse vertical scrolling ( for chat apps ) and there are open issues but it's not likely to be added since they moved to angular 2.x and above
bottom line is : if you want scrolling on both sides with only configuration, i'm afraid you can't, and if you absolutely want this you're going to have to modify angular-material.js to fit your needs.
