mardi 10 novembre 2015

toggle sidebar when button in navbar is clicked in ember

I have two components:

{{pc-sidebar}}
{{pc-navbar action='toggleSidebar'}}

Inside pc-navbar, i have a button that i want toggle an sidebar--active class:

<button {{action 'toggle'}}>toggle sidebar</button>

and in the pc-navbar.js, i have the following:

  isOpen: true,
  actions: {
    toggle () {
        this.toggleProperty('isOpen');
        this.sendAction('action', this.get('isOpen'));
    }
  }

So.. the default value of sidebar is open, and when i click, i want switch for the next state.. true or false, depending on the previous state.

So.. i change the default value and send to my application controller:

  actions: {
    toggleSidebar (nextState) {
      console.log(nextState);
    }
  }

Now.. how can i grap the sidebar and toggle the class?? I'm a little lost here.. Am i doing this write?

In my pc-sidebar.js i have:

export default Ember.Component.extend({
  tagName: 'aside',
  classNames: ['sidebar', 'sidebar--active']
});

Thank you very much!!!

Aucun commentaire:

Enregistrer un commentaire