Signup for the Ionic Newsletter to get the latest news and updates!

  • Ralf

    Can I check somehow if the view is splitted for example to position a popup in the view (not over menu) ?

    • Ralf

      OK, I’ve found a solution.

      In the app controller:

      “`
      $scope.$on(‘$ionicExposeAside’, function(evt, isAsideExposed){
      $rootScope.sidemenuExposed = isAsideExposed;
      });
      “`

      Then we can interact with this rootScope property.

      I think the $ionicSideMenuDelegate should have a method to access this. Please πŸ™‚

    • http://ionicframework.com/ Adam Bradley

      Our documentation needs to be updated, but in the ionSideMenus scope is the variable $exposeAside.active. You can see it in action in this codepen: http://codepen.io/ionic/pen/cDbFg the $exposeAside.active is what is making the menu button in the top left corner show and hide.

      • Ralf

        Thanks. This is what I needed.

      • Ralf

        How to access this property in the controller? Should I inject a module or some other way? I can use it only from HTML template. Using from code cause errors. The same about using it outside the menu scope, e.g. from a view controller where I would like to check whether sidemenu is open in splitview mode.

        And another question by the way, is there a way to programically (from code) hide the side menu that is open in splitview? For example, I’ve got a view over 768px and the side menu is visible because of the expose-aside-when directive. I would like in that view to close/hide the menu however. Using the obvious method of toggleLeft() doesn’t work. Any ideas please?

      • Sasha dos Santos

        Concerning the codepen, perhaps instead of using ng-hide, you should use ng-if=”!exposeAside.active” so the space required by the image isn’t taken up on the left. This is useful if you have other buttons on the header.

  • https://simpleweek.com SimpleWeek

    Thank you! Really needed feature.

  • Tim Wissel

    You guys are smashing it with these updates lately!

  • Matheus Cruz Rocha

    Just amazing, #ionicrocks

  • Jason

    well done.. thank ionic team.. u guy so awesome!!

  • Victor

    What about if you want a side menu with a split view? I.e. a side menu to go to the different “parts” of your app, then a left view that shows a list of items (which can be dynamic) and a right view that’s the detail.

    Would be this possible by nesting views? (That would be 2 side menus, and the inner one being expose-aside-when)

    • Victor

      For my project what I made is something crazy (as split view was not implemented then):
      1. I had one side menu view (following the default sidemenu example, route id: “app”)
      2. Then for each page, I had another view that represents the list view (for a list of apples, call it “app.apples”)
      3. Then I had a subview inside that represents the detail (call it app.apples.detail)
      By using media queries I could set that when the device is in landscape show both views, and when it’s in portrait show one of the two, depending on the state. Why? Because when you go in portrait from the side menu, you first go to the list, to pick the item you want. And when you picked it, then you “go” to the detail view.
      Then I had also to deal with the history (So back buttons don’t mess it up while switching details) and when it’s in portrait and in the detail, show a fake back button that makes the list appear again (If i use the default back button I would go to another view).

      • Kiran Aghor

        Hi could you please share the sample code (or link to github gist)? I am looking for exact same implementation. Thanks.

        • Victor

          Here you go! http://www.livewind.cat/ionic/tablet.zip
          It’s a bit documented. Please keep me as original author, as this took quite a long time to develop.

          Note that I’m using device.js to know the device state ( https://github.com/matthewhudson/device.js )

          • Kiran Aghor

            Thank you very much πŸ™‚ and yes I will keep your name as original author.

          • Brian Jones

            I’d like to see the code that does this, but the you originally used appears to be broken. Is there another place I can access it?

          • http://about.me/jigar Jigar

            Hi, Do you still have have that code. Even we are implementing the same. Thanks.

          • Kiran Aghor

            Unfortunately I don’t.

      • Brian Jones

        I’d like to see the code that does this, but the link appears to be broken. Is there another place I can access it?

  • sascha

    Extreme usefuel, Thanks a lot from Germany πŸ™‚

  • http://danharper.me/ Dan Harper

    Is it possible for the collapsed split view to display as a full page, instead of a side menu? i.e. like Mail on iOS?

  • http://www.giorgiopagliara.com Giorgio Pagliara

    Finally! Yeeeeeee!! πŸ™‚
    I this usable in combination with tabs also?
    I mean:
    – Tabs for smaller screens
    – Exposed Side Menu for larger screens (and landscape orientations)

  • joshlovesjen

    NICE! Thanks!

  • Bram Debouvere

    Too bad it doesn’t work with side=”right”

  • Rihdus

    Sweet! ionic rocks

  • Pradita Utama

    Thank you! before this, i must add new css class. Greetings from Indonesia.

  • Antonio Marcello

    I Lovionic! <3

  • Guest

    I noticed this is defaulting the pane over 275px (-webkit-transform: translate3d(275px, 0px, 0px);). My menu is 200px. Thus there’s a 75px gap. Can this be adjusted? Thanks so much.

  • Jerone M Altura

    Cool. you guys rocks! I am so excited if you release also the NG-Material

  • http://www.raymondcamdencom/ Raymond Camden

    Hey guys, a minor tweak. I forked the CodePen here, http://codepen.io/cfjedimaster/pen/BaDFH, to switch the div based list to ion-list. Seems like it would be best practice to use directives whenever possible?

  • darrenkitlor

    Awesome. Amazing work.

    Can we use ppi support as some small phones have 1080p screens? CSS support for that is all over the place.

    • CT59404

      CSS Support goes by the Virtual Resolution; So while the whole may be 1080; It’s actually scaled 2X so it will show a Virtual Resolution of half; or some other percentage therein.

  • Keoshi

    omg, you guys need to stop, I can’t process all the stuff you release!

  • auser

    Totally great!

  • Juukie14

    Awesome! Thanks so much for alll the hard work.

  • nghuuphuoc

    I don’t want to make this comment thread too long, but I have to say “Awesome!”. Thanks Ionic team!

  • Amrudesh

    cool…. very essential feature..

  • Mavlarn

    great feature, very useful.

  • egm

    Why can’t you use side=”right” with expose-aside-when ??

  • Bruno Seixas

    Simple things that make our day =)

  • Sasha dos Santos

    Great feature but like other commenters pointed out, this doesn’t play nice with side=’right’ and I think if this is not a bug, then it should be documented. If both left and right menus are defined, then regardless of which one you add the expose-aside-when=”large” attribute, it is the left that shows, which is very very odd. Also, if you use expose-aside-when=”large” then the left will show and there is no way to swipe to see the right menu.

  • junerockwell

    Is it possible to have the stay put and hide the when the screen is less than 768px? In other words, is it possible to have an attribute on ? And while the screen is less than 768px, the is the only view that’s visible and will appear only when one of the items in is clicked?

  • https://twitter.com/NoTimeWaste @NotWasteOurTime (on Twitter)

    Sick!