Coffeescript缩进有问题

Question

I'm trying to translate this into Coffeescript:

App.IndexView = Ember.View.extend(InfiniteScroll.ViewMixin, {
  didInsertElement: function(){
    this.setupInfiniteScrollListener();
  },
  willDestroyElement: function(){
    this.teardownInfiniteScrollListener();
  }
});

My first approach was this:

Whistlr.OrganizationsView = Em.View.extend
  InfiniteScroll.ViewMixin
  didInsertElement: ->
    @setupInfiniteScrollListener()
  willDestroyElement: ->
    @teardownInfiniteScrollListener()

But it threw an unexpected indent error. So I tried this instead:

Whistlr.OrganizationsView = Em.View.extend InfiniteScroll.ViewMixin
  didInsertElement: ->
    @setupInfiniteScrollListener()
  willDestroyElement: ->
    @teardownInfiniteScrollListener()

Which gives me this error:

TypeError: InfiniteScroll.ViewMixin is not a function

If I use the plain js, it works fine. So the problem is definitely with the Coffeescript formatting. I'm having trouble figuring out what's going on, or even how to properly search for an explanation. Any pointers would be appreciated!

Answer 1

Try

Whistlr.OrganizationsView = Em.View.extend InfiniteScroll.ViewMixin,
  didInsertElement: -> @setupInfiniteScrollListener()
  willDestroyElement: -> @teardownInfiniteScrollListener()

The second parameter of .extend needs to be an JavaScript object.

Answer 2

This is a quick translation of the JS to Coffeescript. When I paste it into the 'Try Coffeescript' browser window, it produces the same JS (with added returns). The extra (){} are for my benefit, not CS's. They make it clear to me that this is a call to extend , with 2 arguments, one an object attribute, the other an object with two function definitions.

App.IndexView = Ember.View.extend(
    InfiniteScroll.ViewMixin,
    {
    didInsertElement: ()  ->
        @setupInfiniteScrollListener()
    willDestroyElement: () ->
        @teardownInfiniteScrollListener()
    }
)