Search code examples
angularjsionic-frameworkslideionic-view

ionic slides with ng-repeat causing issues (slide-box)


In ion-slide-box ionic

The first time I try to populate a slide-box using ng-repeats the slidebox pager doesn't show when the page is loaded, when trying to debug on chrome (desktop) and open the inspector, the slidebox gets fixed automatically.

Is there a way to force a reload of the slide-box after page load?

HTML Code

<ion-slide ion-slide-tab-label="Work Order Progress" class="form-bg">
    <ion-scroll direction="y">
        <div ng-if="pieMenuList.length > 0">
            <div ui-sref="{{wopc.state}}({filter:'{{wopc.params}}'})" class="chart-color" ng-repeat="wopc in pieMenuList">
                <div class="arrow_box" style="color: {{wopc.color}};background-color:currentColor">
                    <span style="color:#fff;">{{wopc.name}}</span>
                    <span ng-bind="wopc.count" class="wo-count" style="background-color:{{wopc.color}};"></span>
                </div>
            </div>
        </div>
    </ion-scroll>
</ion-slide>

Solution

  • For anyone, who still looking for the solution to this problem

    In your controller inject ionSlideBoxDelegate

    .controller('MyCtrl', function($scope, $ionSlideBoxDelegate) {
        //after populating your data in slide just call
        $ionicSlideBoxDelegate.update();
    
    }