1. Single Side barNavigation code in the analysis of the source of the time has been analyzed, the following only to see some of his application and methods.
/ *---Sample code----* /<Ion-menu[content]= "Mycontent"> <ion-content> <ion-list> ... </ion-list> </ion-content></Ion-menu> <Ion-nav#mycontent [Root]= "Rootpage"></Ion-nav>/ *---Sample code----* /
The above code actually generates a simple view worth noting is #mycontent
and the [content]=]
mycontent" Actually formed a binding to tell sidebar my content is Ion-nav. Because ionic he is the content of the sidebar to write to Ion-side-menus inside. So here ionic2 more humane. The code will not be a lump of a lump of which is written in the sidebar list, which is written content.
2. Multiple sidebar and Menucontroller API
/ *---Sample code----* /<Ion-menuID= "Authenticated"side= "Left"[content]= "Mycontent">...</Ion-menu><Ion-menuID= "unauthenticated"side= "Left"[content]= "Mycontent">...</Ion-menu> <Ion-nav#mycontent [Root]= "Rootpage"></Ion-nav>/ *---Sample code----* /
First look at the side,side is the control sidebar on the left or right side, the default is the left side. Mainly look at the ID, the value of the ID is unique. We set an ID for each ion-menu this time the page comes in when the Ion-menu sidebar is on top. It shows which. Import:
import {
MenuController
} from
‘ionic-angular‘
;
We need to use
MenucontrollerTo control some of the sidebar's methods. which
this.menu.enable ();method is used to control the display of multiple sidebar he can pass two parameters or a parameter. 1, two parameters if the first parameter indicates whether the second parameter is menuId value 2, one parameter is menuId once you set a parameter, the other sidebar will also be hidden
/* ---The sample code---- */ Enableauthenticatedmenu () { this. menu.enable (True, ' authenticated '); this. menu.enable (false, ' unauthenticated '); // or this. menu.enable (' authenticated '/* ---Sample code----* /
MenucontrollerThere are many other ways. 1. Open
Open ()2. Close
Close ()This method can take a parameter menuId 3, switch
Toggle (menuId)This method can take a parameter menuId when the sidebar is open then close, open 4,
enable (show,menuId) Controls multiple sidebar. Two parameters or one parameter. 5.
swipeenable (shouldenable,menuId) The first parameter represents whether to disable, and the second parameter is which MenuID 6,
IsOpen ()Whether the sidebar is open. 7.
isenabled ()Determine if there is a sidebar that can be opened. 8.
Get (menuId) Returns an instance of a sidebar 9,
Getmenus ()Returns an instance of all the sidebar.
3. Side Bar APIFor example:
<ion-menu id=
"menu"
[content]=
"content"
>
1 content correspondence. 2, ID side bar Id3, side side bar position 4, type side bar display Type 5, enabled sidebar is available 6, swipeenabled side bar can slide show 7, persistent should adhere to sub-page menu.
7. Sidebar: Menu