Ember – Understanding Inverse Relationships

First of all, this post might explain things a bit. It’s not your exact question, but the reasons for the answer are similar. But, to get a clear understanding of what inverses are, you should be familiar with directed graphs. While not immediately apparent, directed graphs are what fuel the idea behind belongsTo and hasMany. … Read more

How to mock an Ember-CLI service in an acceptance test?

Short version of the solution: your registered mock service must have a different service:name than the “real” service you’re trying to mock. Acceptance test: import Ember from ’ember’; import { module, test } from ‘qunit’; import startApp from ‘container-doubling/tests/helpers/start-app’; var application; let speakerMock = Ember.Service.extend({ speak: function() { console.log(“Acceptance Mock!”); } }); module(‘Acceptance | acceptance … Read more

EmberJS – sharing a controller / template for different routes

You were correct throughout. And you can use the new controller and template in edit route also. You have to do only two things. First give the template name as new in the renderTemplate hook of edit route. App.LocationsEditRoute = Ember.Route.extend({ setupController: function(controller, model) { this.controllerFor(‘locations.new’).setProperties({isNew:false,content:model}); }, renderTemplate: function() { this.render(‘locations/new’) } }); As the … Read more

{{content-for ‘head’}} Ember-cli

It was recently added to ember-cli based on this discussion. Here is the relevant code from the commit: EmberApp.prototype.contentFor = function(config, match, type) { var content = []; if (type === ‘head’) { content.push(calculateBaseTag(config)); content.push(‘<meta name=”‘ + config.modulePrefix + ‘/config/environment” ‘ + ‘content=”‘ + escape(JSON.stringify(config)) + ‘”>’); } content = this.project.addons.reduce(function(content, addon) { if (addon.contentFor) … Read more

Ember: Get route instance from the controller

From within a controller, you can access the router via this.get(‘target’). So this.get(‘target’).send(‘goToNextStep’) should work. Like so: App.Flow = Em.ObjectController.extend({ submit: function(){ // … this.get(‘target’).send(‘gotoNextStep’); } } App.FlowRoute = Ember.Route.extend({ events: { gotoNextStep: function(){ // … this.transitionTo(routeName); } } }

How to use third party npm packages with ember cli app

The easiest and recommended answer is to use ember-browserify. (as support for bower packages will be removed in the future.) This is an example for using the npm package dexie within an Ember CLI app. Install browserify: npm install ember-browserify –save-dev Install dexie (or whatever module you need): npm install dexie –save-dev Import the module … Read more

Ember.js & Ember Data: How to create record with hasMany relationship when the parent and child don’t exist yet

I’m just figuring this out myself, but I just did it this way and it works… For starters, when you this.store.createRecord(‘basket’, {}) it should come with an empty array for its fruits property. So, do this: var basket = this.store.createRecord(‘basket’, {}); basket.get(‘fruits’).addObject(this.store.createRecord(‘fruit’, { name: ‘orange’, color: ‘orange’ })); basket.get(‘fruits’).addObject(this.store.createRecord(‘fruit’, { name: ‘banana’, color: ‘yellow’ })); … Read more