Chris Madrigal
Chris Madrigal

Reputation: 1

MarionetteJs extent base controller

Im trying to make a base controller that provides some common functionality that other controller can extend from but somehow Im getting an error when I try to extend my base controller.

Base Controller

define(function (require) {
  var Marionette = require('marionette');

  var BaseController = Marionette.Controller.extend({
    initialize: function(options){
      // Do stuff
    },

    // Other stuff
  });
  return new BaseController();
});

Controller that is extending

define(function (require) {
  var Marionette = require('marionette')
    , BaseController = require('controllers/base_controller')
    ;

  var MyController = BaseController.extend({
    // Do stuff
  });

  return new MyController();
});

error:

Uncaught TypeError: undefined is not a function mycontroller.js line 6

Maybe I cant extend a controller?

Upvotes: 0

Views: 99

Answers (1)

Cubed Eye
Cubed Eye

Reputation: 5631

You need to remove the new & () from the return statement on the Base controller file

return BaseController; // Remove the new && () here

Using the new BaseController() call is return an BaseController instance rather that the constructor function that you are trying to use to extend MyController with.

You should also think about removing them from the MyController file as well and then make the new instance when you want one;

For Example:

// controllers/my_controller.js
define(function (require) {
    var Marionette = require('marionette')
    , BaseController = require('controllers/base_controller');

    var MyController = BaseController.extend({
    // Do stuff
    });

    return MyController;
});

// someotherfile.js
define(function (require) {
   var MyController = require('controllers/my_controller');
   var myControllerInstance = new MyController();
});

This way your controller modules will always return the constructor function that you can use to extend again rather that returning a single instance:

// controllers/my_awesome_controller.js
define(function (require) {
   var MyController = require('controllers/my_controller');
   var MyAwesomeController = new MyController.extend({
       // Extend more awesomeness
   });
   return MyAwesomeController;
});

Upvotes: 1

Related Questions