離子Angular JS $ routeProvider加載離子列表不會滾動

我有一個離子內容標籤與ng-view，這是使用routeProvider拉部分。每個部分都從XML APi加載列表，除非列表完全不可滾動，否則這一切都是完美無缺的。我試過使用離子滾動（它工作，但是當你釋放，它滾動回列表的頂部），以及scroll =「true」和overflow-scroll =「true」。

沒有用。下面是一些代碼：

<ion-header-bar class="bar-stable"> 
    <label class="item-input-wrapper header"> 
     <i class="icon ion-android-search placeholder-icon"></i> 
     <input type="search" placeholder="Search" ng-model="search.$" /> 
    </label> 
</ion-header-bar> 
<ion-content class="has-header" data-ng-view overflow-scroll="true"></ion-content>

而這裏的一個局部的例子（它們都遵循完全相同的結構。）

<ion-list> 
    <ion-item data-ng-repeat="route in routes | filter:search" data-ng-click="showRoute(route)">{{route._title}}</ion-item> 
</ion-list>

下面是腳本：

app.config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
      templateUrl: 'partials/route-list.html', 
      controller: 'RouteListController' 
     }) 
     .when('/route', { 
      templateUrl: 'partials/stop-list.html', 
      controller: 'StopListController' 
     }) 
     .when('/stop', { 
      templateUrl: 'partials/prediction.html', 
      controller: 'PredictionController' 
     }); 
    });

測試的iPhone 4S模擬。任何意見，將不勝感激。

感謝

來源

2014-10-01 stefannew

嘗試把一個div與NG-觀點指令內離子含量

<ion-content class="has-header"> 
    <div data-ng-view></div> 
</ion-content>

來源

2014-10-01 23:02:17

這工作，但現在當了NG-視圖的變化，滾動條位置保持不變。如果下一個列表比前一個短，用戶必須手動回滾才能看到任何內容。我接受你的答案，因爲它確實解決了我的問題，但是你是否知道爲什麼會出現下一個問題？ – stefannew 2014-10-02 03:44:37

http://ionicframework.com/docs/api/service/$ionicScrollDelegate/。您應該在每個控制器上調用$ ionicScrollDelegate.scrollTop（）。順便說一句，使用$ stateProvider。這裏有一個很好的入門模板：https：//github.com/driftyco/ionic-starter-sidemenu。它管理頁面變化之間的滾動位置 – 2014-10-02 17:16:08

謝謝，ionicScrollDelegate完美工作。除了我使用的$ routeProvider方法之外，使用$ stateProvider還有什麼好處嗎？ – stefannew 2014-10-02 19:05:03

離子Angular JS $ routeProvider加載離子列表不會滾動

回答

相關問題