In todomvc backbone example, why use event bind instead of routes in controller?

Question

For example, in app-view.js, I see some event bind:

    events: {
        'keypress #new-todo': 'createOnEnter',
        'click #clear-completed': 'clearCompleted',
        'click #toggle-all': 'toggleAllComplete'
    },

but in my opinion, the routes in controller could replace event bind at all, like:

var TodoRouter = Backbone.Router.extend({
    routes: {
        '*filter': 'setFilter',
         'todo/add': 'add',
         'todo/edit/:id': 'edit',
         'todo/delete/:id': 'delete'
    },
    add: function () {...},
    edit: function () {...},
       ......
});

and just replace the button with link, and I think use routes make it more like a mvc app, just like ASP.NET MVC

Why it still use event bind?

Answer 1

Your question is good but take an example:

1.Suppose you used routes for your different events for a single view. All your clicks will go into router which is totally not needed.

2.Now you have 10 different views which is having 20 different clicks in it.
Will you assign it in router? Button click or key-press click is not a different route.
They are just event which you should handle in that particular view.

3.Also backbone route is fired only on hash change. If you use routers for events then may be backbone will allow you to click once cause after that route is not changed.So next click event will not get captured.

So its a good practice to keep each functionality separate so that it will serve its best and code will also get manageable.