Mark Wong
Posts: 0
Joined: Sat Feb 14, 2015 7:47 am

How can I control the slide panel visibility in Angular JS (Ionic)?

I would like the sliding panel not able to show in specific pages.
I tried to bind the variables with panel but that does not work

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

Hello Mark,

You can enable/disable it in the properties panel of the page.

Mark Wong
Posts: 0
Joined: Sat Feb 14, 2015 7:47 am

How can I control the slide panel visibility in Angular JS (Ionic)?

Sorry for not making it clear,
I would like to enable (show) the panel when ng-click : function();
What would be the javascript code for me to achieve that

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

Please use JS below for that:

pre$ionicSideMenuDelegate = Apperyio.get("$ionicSideMenuDelegate");
$ionicSideMenuDelegate.toggleLeft();/pre

More information about slide panel here: http://ionicframework.com/docs/api/se...

Mark Wong
Posts: 0
Joined: Sat Feb 14, 2015 7:47 am

How can I control the slide panel visibility in Angular JS (Ionic)?

Sorry, one last thing,
If I want the side menu cannot be toggled in specific pages, e.g. loginPage.

Should I bind the side-menu to a variable in Boolean form? And would you like to give me an example to help me?
Thank you

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

There are no default mechanism to do that. But you can use workaround:

Add a function to ng-swipe-left/ng-swipe-right attributes for the ng-view on the index.page. Check in that function current page and use "return false;" on pages which shouldn't have slide menu

Mark Wong
Posts: 0
Joined: Sat Feb 14, 2015 7:47 am

How can I control the slide panel visibility in Angular JS (Ionic)?

Apparently the above method is not working for me :
I set "ng-swipe-right" to "true" of "ng-view" of the index and it doesn't allow swipe.

I have a workaround of using css to block transform of the side-menu

.menu-content{
transform: translate3d(0px, 0px, 0px) !important;
}
Thank you for helping

Ricardo Amaral
Posts: 0
Joined: Thu Mar 17, 2016 7:33 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

To try to save time:

The CSS .menu-content approach work for web browser but didn't worked at my Android phone.

The ng-swipe-left/ng-swipe-right at ng-view approach always block the swipe for all pages even the parameter is true.

In other hand if you go to the page you want to block the swipe and include ng-swipe-right or ng-swipe-left at page level Attributes, it will block the slide for that specific page. I have that at my logon page.

Thank you!

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

Hello Ricardo, do you need further assistance? Could you clarify the question?

Ricardo Amaral
Posts: 0
Joined: Thu Mar 17, 2016 7:33 pm

How can I control the slide panel visibility in Angular JS (Ionic)?

That is ok, I could solve that using this: to block the swipe on a specific page, go to desired page and include ng-swipe-right or ng-swipe-left Attribute at page level.

Thank you!

Return to “Issues”