离子滑块不能从左到右工作

时间:2018-05-31 11:38:43

标签: angularjs ionic-v1

我是离子的新手。我面临的问题是我正在尝试使用离子滑块和ng-repeat。数据是动态的。如果我从右向左滑动,一切都很完美。但是如果我从左边滑动右边菜单出现,我无法刷内容。

这是我的HTML

    <ion-slide-box dynamic-height>
    <ion-slide ng-repeat="caseload in caseloads" dynamic-slides="caseloads">
    <img src="test.png">
    {{caseload.lastName}}
    DOB: {{caseload.dob}}   {{caseload.offenderSID}}<br/>
    {{caseload.leadState}}
    </ion-slide>
    </ion-slide-box>

这是我用于幻灯片的指令

app.js

    app.directive('dynamicHeight', function() {
    return {
    require: ['ionSlideBox'],
    link: function(scope, elem, attrs, slider) {
        scope.$watch(function() {
            return slider[0].__slider.selected();
        }, function(val) {
            var newHeight = $('.slider-slide', elem).eq(val).innerHeight();
            if (newHeight) {
                elem.animate({
                    height: newHeight + 'px'
                }, 500);
            }
        });
    }
    };
    })

这是Controller.js

    function ($scope,$state,$http,$ionicSlideBoxDelegate) 
    {
    $http({
    method : 'POST',
    url : 'http://localhost:8080/ODIN/getLeadsByOfficerForMobile?
    dumId='+$scope.adminhome,
    }).then(function success(data) {
     if(data.data!=null){
        $scope.caseloads = data.data;

        console.log($scope.caseloads);
    }
    //$scope.playlists.splice(index, 1);
    });
    $ionicSlideBoxDelegate.update();
    }

任何人都可以告诉如何解决此问题吗?它适用于从右向左滑动,但如果我从左向右滑动,则会拖动主菜单而不是滑动。

1 个答案:

答案 0 :(得分:0)

在控制器中使用以下代码。

注意:您必须在控制器中注入$ rootScope和$ ionicSideMenuDelegate。

CodePen for refrence:“https://codepen.io/mhartington/pen/sqJAp

  $rootScope.data = {
canDrag: false};

希望这有帮助:)