2015-05-30 15 views
9

Tôi đang làm việc trên một chatapp và giống như hầu hết các ứng dụng của tôi cho thấy một danh sách các tin nhắn.Làm cách nào để bắt đầu danh sách cuộn từ dưới cùng?

  • Danh sách được tạo với ng-repeat.
  • Tôi đã đảo ngược các thư để thư mới nhất ở dưới cùng và lâu đời nhất ở trên cùng.

Hiện nay khi ứng dụng của tôi tải danh sách được cuộn xuống với

$ ionicScrollDelegate

tôi không thích nó làm nó theo cách này. Đó không phải là cách chính xác và đôi khi điều này mang lại cho tôi một số vấn đề về hiệu suất và tải khi mở ứng dụng của tôi.

Tôi đã tự hỏi nếu có một cách bắt buộc khác, để bắt đầu/hiển thị danh sách từ dưới lên trên mà không cần cuộn xuống dưới cùng như bây giờ.

Đây là mã Tôi hiện đang sử dụng:
Trong HTML của tôi:

<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> 

Trong tôi app.js:

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

Hãy tham khảo điều này, nó có thể giúp bạn nhưng không chắc chắn: https://codepen.io/rossmartin/pen/XJmpQr –

Trả lời

1

Thêm một chiếc đồng hồ thay vì:

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

Lý do bạn đang nhận được hành vi này là nguyên nhân gây ra thiết bịReady không đảm bảo tại các mục được hiển thị, điều này làm cho danh sách của bạn không cuộn ở bất kỳ đâu. Với một chiếc đồng hồ, bạn sẽ cuộn khi mảng đã được tải và các giá trị đã có sẵn.

+0

OP yêu cầu thực hiện việc này "mà không cần cuộn xuống dưới cùng" – lilbiscuit

Các vấn đề liên quan