Issue
I have an ion-content
tag with ng-view which is pulling in partials using a routeProvider. Each partial is loading a list from an XML API and this is all working flawlessly, except the lists are completely unscrollable.
I've tried using ion-scroll
(which works, but when you release, it scrolls back to the top of the list), as well as scroll="true"
and overflow-scroll="true"
.
Nothing works. Here's some code:
<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>
And here's an example of a partial (They all follow exactly the same structure.)
<ion-list>
<ion-item data-ng-repeat="route in routes | filter:search" data-ng-click="showRoute(route)">{{route._title}}</ion-item>
</ion-list>
Here is the script:
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'
});
});
Testing on iPhone 4S Simulated. Any advice would be appreciated.
Thanks
Solution
Try putting a div with the ng-view directive inside ion-content
<ion-content class="has-header">
<div data-ng-view></div>
</ion-content>
Answered By - user4100003
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.