Question

我正在开发一个chatapp，就像大多数chatapps一样，我的应用程序显示了一个消息列表。

该列表是使用ng-repeat生成的。
我已经撤消了消息，以便最新的消息在底部最古老的。

目前，当我的应用加载时，列表会向下滚动

$ ionicScrollDelegate

我不喜欢这样做。这不是正确的方式，有时这会在打开我的应用程序时给我一些性能和加载问题。

我想知道是否有另一种强制方式，从底部到顶部开始/渲染列表，而不需要像现在一样将其滚动到底部。

这是我目前使用的代码：
在我的HTML中：

<script type="text/ng-template" id="home.html">
    <ion-view ng-controller="HomeController" title="Home">
        <ion-content>
            <ion-list>
                <ion-item ng-repeat="message in messages track by $index">
                    {{message}}
                </ion-item>
            </ion-list>
        </ion-content>    
    </ion-view>
</script>

在我的app.js：

中

app.run(function($ionicPlatform, $state, $timeout, $localStorage, $location, $rootScope, $ionicScrollDelegate) {
    document.addEventListener('deviceReady', function() {
        setTimeout(function() {
                $ionicScrollDelegate.scrollBottom(true);
        }, 500);
    });
})

Answer 1

添加手表：

 $scope.$watch('messages', function(newValue, oldValue) {
   $ionicScrollDelegate.scrollBottom(true);
 }, true);

您获得此行为的原因是因为deviceReady不保证项目已呈现，这会导致您的列表根本不滚动。使用手表，您可以在加载数组并且值已经存在时滚动。

如何从底部开始滚动列表？

1 个答案: