Infinitely growing list

                        
<ul data-bind="foreach: items, bottomsUp: true">
    <li data-bind="text: $data"></li>
</ul>
                    
                        
var viewModel = { items: ko.observableArray() },
    i = 1;
ko.applyBindings(viewModel);
setInterval(function () {
    viewModel.items.push('foo ' + i++);
}, 1000);
                    

Infinitely growing list trimmed down to 10 items while scrolled to the bottom

                        
<ul data-bind="foreach: items, bottomsUp: { trim: 10 }">
    <li data-bind="text: $data"></li>
</ul>
                    
                        
var viewModel = { items: ko.observableArray() },
    i = 1;
ko.applyBindings(viewModel);
setInterval(function () {
    viewModel.items.push('foo ' + i++);
}, 1000);
                    
Fork me on GitHub