Simple Router Service

01_README.md

This serves as a base canary gist for @rwjblue.

A few useful links for the main source/gist are:

• View Twiddle
• Copy Twiddle
• View Gist

application.route.js

import Ember from 'ember';
import log from '../utils/log';

export default Ember.Route.extend({
  actions: {
    error: function(error) {
      log(error.message);
    },
    
    updateFooBar() {
      log(...arguments);
    }
  }
});

application.template.hbs

<h1>rwjblue's Ember Twiddle</h1>

{{outlet}}

{{foo-bar}}

<pre id="logs"></pre>

foo-bar.component.js

import Ember from 'ember';

export default Ember.Component.extend({
  router: Ember.inject.service(),
  actions: {
    goAway() {
     	this.get('router').transitionTo('bar'); 
    }
  }
});

foo-bar.template.hbs

<button {{action 'goAway'}}>Update!</button>

router.js

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
  this.route('bar');
});

export default Router;

services.router.js

import Ember from 'ember';

export default Ember.Service.extend({
  init() {
    this._super(...arguments);
    this.router = this.container.lookup('router:main'); 
  },
  
  transitionTo() {
  	return this.router.transitionTo(...arguments);
  },
  
  send() {
   	return this.router.send(...arguments); 
  }
});

twiddle.json

{
  "version": "0.4.13",
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "http://builds.emberjs.com/canary/ember.debug.js",
    "ember-template-compiler": "http://builds.emberjs.com/canary/ember-template-compiler.js"
  }
}

utils.log.js

import Ember from 'ember';



export default function log(...args) {
  let msg = args.join(' ');
  let logs = document.getElementById('logs');
  
  logs.insertBefore(
    document.createTextNode("\n" + msg),
    logs.firstChild
  );
}