Richard Knop
Richard Knop

Reputation: 83755

EmberJS Inheritance Conundrum

Consider this situation. I have a common logic which I want to reuse across Ember.ArrayController and Ember.ObjectController instances.

Both Ember.ArrayController and Ember.ObjectController are derived from a basic Ember.Object so I am trying something like:

AbstractController = Ember.Object.extend({
// some methods with common logic
});

AbstractArrayController = AbstractController.extend({});
AbstractObjectController = AbstractController.extend({});

The problem is I also need AbstractArrayController and AbstractObjectController to extend from their parents (Ember.ArrayController and Ember.ObjectController).

How would I achieve this sort of inheritance?

I am looking at reopen and reopenClass methods right now, maybe they could be useful: http://emberjs.com/api/classes/Ember.Object.html#method_reopen

I tried just doing something like:

Ember.Object.reopenClass({

    foo: function () {
        return "foo";
    }.property("foo")

});

But that doesn't seem to work.

Another way to put the problem:

App.HelloController = Ember.ObjectController.extend({

    foo: function () {
        return "foo";
    }.property("foo")

});

App.WorldController = Ember.ObjectController.extend({

    foo: function () {
        return "foo";
    }.property("foo")

});

How to abstract the foo computed property?

Upvotes: 1

Views: 452

Answers (1)

Ryan
Ryan

Reputation: 3594

reopenClass adds methods on the class object, not the instance objects. When you do:

Ember.Object.reopenClass({
  foo: function () {
    return "foo";
  }.property("foo")
});

You are creating Ember.Object.foo().

You need to use reopen if you want to methods at an instance level, for example Ember.Object.create().foo().

To answer you question, the best way to abstract a function that many types of objects can use is with a mixin. To create a mixin you use.

var mixin = Ember.Mixin.create({
  foo: function() {
    return 'foo';
  }
});

And to have your objects take advantage of that mixin you can use.

var MyController = Ember.ObjectController.extend(mixin, {
  // ...
});

More about mixins: http://codingvalue.com/blog/emberjs-mixins/ and http://emberjs.com/api/classes/Ember.Mixin.html

Upvotes: 6

Related Questions