Thought exercise on "Ember Controllerless"

user.hbs

<p>{{data.firstName}}</p>
<p>{{data.lastName}}</p>

{{some-component user=data}}

<button {{action 'someAction' data.username}}>Trigger someAction</button>

user.js

import Route from '@ember/routing/route';
import { action } from '@ember-decorators/object';
import { model } from '@ember-decorators/model';

export Class extends Route {
  @service queryParams
  
  @model
  data() {
    const { sort } = this.queryParams.forRoute(this)
    
    // Anything returned from here would be accessible on the 
    // template via `data` 
    return fetch(`/v1/data?sort=${sort}`).then(res => res.json());
  }
  
  willEnter() {}
  didEnter() {}
  
  willLeave() {}
  didLeave() {}
  
  @action
  someAction() {
    // ...
  }
}