Fdr
Fdr

Reputation: 3714

Structuring backbone.js app with require.js

I started following Organizing your application using Modules (require.js tutorial, but after adding first event handler to my view - I encountered problem:


// Filename: views/project/list
define([
  'jquery',
  'underscore',
  'backbone',
  'handlebars',
  'collections/projects',
  'text!templates/projects/list.js'
], function ($, _, Backbone, Handlebars, ProjectsCollection, projectListTemplate) {
    var ProjectListView = Backbone.View.extend({
        el: $('#container'),
        events: {
            "click .open-proj": "openProject",
        },
        initialize: function () {
          ...
        },
        render: function () {
            ...
        },
        openProject: function(e) {
            // HERE I WANT TO TRIGGER ROUTING VIA router.navigate
            alert("opened");
        }
    });
    // Our module now returns our view
    return ProjectListView;
});

In the openProject callback I want to trigger routing, but I cannot introduce dependency to app.js as it would cause circular dependency(router depends on view). How should I handle this?

Upvotes: 1

Views: 296

Answers (1)

yonilevy
yonilevy

Reputation: 5428

You can pass your router to the ProjectListView when you create it:

var projectListView = new ProjectListView({
    router: app_router
});

Since ProjectListView is a Backbone.View, it can then access the router using this.options.router, no circular dependency problem here.

Upvotes: 3

Related Questions