javascriptember.jsember-components

What is the proper way to invoke a closure action inside a component?


I pass a closure action into my component like so:

{{deployment-timeline loadMoreDeployments=(action "loadMoreDeployments")}}

How should I invoke this in my component?

actions:{
  loadMoreDeployments(){
    // which one of the following three invocations is best?
    this.attrs.loadMoreDeployments();
    this.get('loadMoreDeployments')();
    this.loadMoreDeployments();
  }
}

Solution

  • You should do

    this.get('loadMoreDeployments')();
    

    or

    import {get} from '@ember/object';
    ...
    get(this, 'loadMoreDeployments')();
    

    The use of attrs was never probably introduced, and accessing a property on an ember object with dot notation is not recommended.

    Edit: With ember 3.1 (currently in beta) we will get support for dot notation for getters (no setters yet, and not for proxy objects). This means that from ember 3.1 on you can safely use:

    this.loadMoreDeployments();