How do I use Ember without controllers?

Ember, from what I’ve read, is moving away from controllers in favor of components. But the documentation from what I could find doesn’t really describe how to perform similar functionality without a controller. What would be the correct way to do this?

As an example: I’m making a notetaking app. I need to create a new notebook (or note) before the logic can be handled by a component.

So if I were using a controller to create the notebook, this code works:

export default Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
     ....
      notebooks: this.store.findAll('notebook')
    });
  }
});

 export default Ember.Controller.extend({
    defaultNbName: Ember.computed('notebooks', function() {
            let notebooks = this.get('model.notebooks');
            let defaultName = 'New Notebook';
            let count = 0;
            // append id to notebook name based on existing default names
            notebooks.forEach(function(nb){
              let name = nb.get('name').substring(0, defaultName.length);
              if (name === 'New Notebook') count++;
            });
            return defaultName + ' ' +  count;
          }),

          defaultNb: Ember.computed('defaultNbName', function() {
            let nbName = this.get('defaultNbName');
            return {
              name: nbName,
              createdAt: new Date(),
              notes: []
            }
          }),

          actions: {
            createNotebook() {
              let nb = this.get('defaultNb');
              let newNb =  this.get('store').createRecord('notebook', nb);
              newNb.save().then(() => {
                this.transitionToRoute('notebook', newNb.id);
              });
            }
          }
        });

But without a controller I’m unsure of how to proceed. Using the example, what would be the correct way to create a notebook for the corresponding component to use?

Use controllers like you would normally. When the time comes to move to routable components, and it’s going to take a while longer, we will provide documentation on how to upgrade to the new patterns.

There was confusion in the community about how to deal with controllers due to the announcement of routable components and the initial predictions for their release. We’re currently working on releasing work that will later unlock that functionality.

5 Likes

This is inaccurate, and diminishes the care and thought that the core team puts into Ember’s development.

Routable Components are an old idea that comes from a refactoring of the old Routable Controller/View pair. The conceptual Routable Controller will still be there, but the semantics will be different. You are expected to move persistent state to Services, as Routable Components (as currently designed) are not singletons, and you’ll have access to the DOM again, and related component lifecycle hooks. It is a simplification of the mental model that has been being thought about for a long while, not a populist move.

@locks - Sorry, I wasn’t trying to level criticism, it was actually more of a statement about the slight obsession with components that I am little weary of but obviously that’s come across as implying the core team are following the crowd which wasn’t my intention.

I’ve pushed for Ember many times lately in both internal and external discussions and love the framework but I’ll remove my previous post as it’s clearly not reflected that and caused unintended offense.

There was no need to remove the post! I’m sorry if I’m defensive, a side effect of being conditioned by a hostile interweb reaction to Ember related stuff. I reworded the original phrasing in an attempt to be more clear.

The core team definitely takes inspiration where it can, and re-evaluates the project to make sure Ember’s pursuing the best path, whether performance, developer experience, both now and in the future. Thank you for betting on Ember, you won’t regret it!

1 Like