user1323136
user1323136

Reputation: 899

What am i missing here? Angularjs ionic sliders

I am using the sliders in the ionic framework and everything is working great. This is my html:

<ion-slide-box on-slide-changed="slideHasChanged($index)" show-pager={{showPager}}>

Pretty straightforward, notice that i am using showPager to dynamically show and hide the pager.

And in the controller:

$scope.showPager = true

$scope.slideHasChanged = ($index) ->
    if $index == 4
      $scope.$apply ->
        $scope.showPager = false

It does as expected sets showPager value to false when the index of the slide is 4 in the web console.

BUT it does not really hide it on the web page. IF i explicitly set showPager to false, it does not display in the browser as expected, but if i try the above stuff to dynamically hide it, it does not work.

What am i missing?

Upvotes: 0

Views: 516

Answers (1)

Shripal Soni
Shripal Soni

Reputation: 2448

<ion-slide-box> directive does not observe show-pager attribute. So it will consider only the value which was at the time of directive initialization.

For your use-case, you can show/hide pager by putting ng-class directive on <ion-slide-box> directive and based on that class you can write css to show/hide the pager.

Check this example codepen for working example.

Upvotes: 1

Related Questions