Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
model.unload() => FilteredRecordArray null values (broken)
import Ember from 'ember';
const {
computed,
get,
} = Ember;
export default Ember.Controller.extend({
store: Ember.inject.service(),
todos: computed('model', function() {
return this.get('store').filter('todo', todo => {
return get(todo, 'list.id') === get(this, 'model.id');
});
}),
hasTodos: computed('todos.[]', function() {
return get(this, 'todos').get('length') > 0;
}),
actions: {
addTodo(todo) {
get(this, 'store').createRecord('todo', {
name: todo,
list: get(this, 'model')
});
return false;
},
removeTodo(todo) {
const todos = get(this, 'todos');
todo.unloadRecord();
todos.forEach(todo => {
Ember.assert('should not have null todo', todo !== null);
});
},
},
});
import $ from 'jquery';
export default {
name: 'on-error',
initialize(application) {
Ember.onerror = function(error) {
$('.error-section').append('<div>' + error + '</div>\n');
};
}
};
import Model from "ember-data/model";
import attr from "ember-data/attr";
import { belongsTo, hasMany } from "ember-data/relationships";
export default Model.extend({
todos: hasMany('todo', { async: false })
});
import Model from "ember-data/model";
import attr from "ember-data/attr";
import { belongsTo, hasMany } from "ember-data/relationships";
export default Model.extend({
name: attr('string'),
list: belongsTo('todoList', { async: false })
});
import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend({
location: 'none',
rootURL: config.rootURL
});
Router.map(function() {
this.route('todo-list', { path: '/' });
});
export default Router;
import Ember from 'ember';
const DUMMY_TODO_LIST = {
data: {
type: 'todo-list',
id: 42,
attributes: {},
},
included: [{
type: 'todo',
id: 123,
attributes: {
name: 'Figure out this bug',
},
relationships: {
list: {
data: {
id: '42',
type: 'todo-list',
},
},
},
}],
};
export default Ember.Route.extend({
model() {
this.store.pushPayload(DUMMY_TODO_LIST);
return this.store.peekRecord('todo-list', '42');
},
// Creating the record this way, however, works just fine
// model() {
// return this.store.createRecord('todo', {
// id: '42',
// todos: [],
// });
// },
// afterModel(model) {
// const todos = model.get('todos');
// return todos.createRecord({ id: '123', name: 'this works though' });
// },
});
body {
margin: 12px 16px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 12pt;
}
.error-section {
position: fixed;
bottom: 0;
left: 0;
right: 0;
max-height: 100px;
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.error-section div {
padding: 6px 14px;
}
<form {{action 'addTodo' newTodo on='submit'}}>
{{input type='text' value=newTodo placeholder='Add todo'}}
<input type="submit" value="Add todo" />
</form>
{{#if hasTodos}}
<ul>
{{#each todos as |todo|}}
<li>
{{todo.name}}
<button {{action 'removeTodo' todo}}>Done</button>
</li>
{{/each}}
</ul>
{{else}}
<p>No todos</p>
{{/if}}
<div class="error-section">
</div>
{
"version": "0.12.1",
"EmberENV": {
"ENABLE_DS_FILTER": true,
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
"ember": "2.12.0",
"ember-template-compiler": "2.12.0",
"ember-testing": "2.12.0"
},
"addons": {
"ember-data": "2.13.2"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment