For some reason, I am unable to push records to the store. I have tried the most basic examples given from the 2.1 docs for the store.push and store.pushPayload examples.
I first tried using:
store.push(store.normalize('myModel', item));
then I tried
store.push({
data: {
id: '666',
type: 'myModel',
attributes: { name: "Bar" },
relationships: { }
}
});
The store.push when used (how I think is correct), returned nothing. I was able to run store.peekAll('myModel').mapBy('name'), and I saw the results of the data I pushed to the store. The data never appeared in the chrome ember inspector. When I used this.store.peekAll('myModel') in my route’s model, no results appeared whereas this.store.findAll('myModel') resulting data would render to my templates and appear in the chrome ember inpsector.
I’m trying to avoid a trip to the server and that is why I want to hydrate the store from data cached in localStorage, and so I’m using peekAll. Any ideas why I’m not seeing data I’m pushing to the store rendering in my templates or why the chrome ember inspector is not showing?
Edit:
I forgot to mention that I am not using the default JSONApi adapter. I am using the most recent version of active-model-adapter with the most recent version of ember-data (2.1 and I tried 2.2-beta3), and ember 2.1. I also have one model that uses LocalForage adapter/serializer and that one also does not work with being pushed to directly. However everything works so long as I use findAll instead of manually push records + peekAll.
Ricardo Mendes helped me figure out what I was doing wrong. I was using the "store:main" container.
App.__container__.lookup('store:main'); // ember 1.x
This does not fly with ember 2.0. The container needs to be "service:store" as in:
App.__container__.lookup('service:store'); // ember 2.x
I was using the API correctly, just pushing to the wrong store.
Related
I have the following route:
/projects/5/files
I read in the API that using find() and findAll() will automatically update any templates that use their results when records are pushed to the store. How can I do that with the child file records?
Take note that the file records are already in the store as they are returned embedded with the project response from the server.
Currently, this is the model hook in my projects/files.js route:
model() {
return this.modelFor('project').get('attachments')
}
This works on first load but won't update when adding records to the store afterwards.
Actually it does update!
Checkout this ember-twiddle!
You can not just add an attachment but also have to connect it to the project!
I'm getting started with Ember (CLI) and am trying to create a simple CRUD setup, using Sails as my API. Ember's loading all the data as expected, but won't save any changes. I've made some actions buttons to toggle Booleans, and increment a counter, but these just revert back. However, Sails' default attribute "updatedAt" is updated with the date of the attempted update.
It seems GET and DELETE work fine, but am I perhaps missing a step for PUT and POST to work properly?
I'm using the mphasize's sails-ember-blueprints, but haven't read about much trouble with them.
here
It turns out that I had some issues with plurality. The model title in the json payload was singular, and the backend plural. Took a little rejigging, but this was only a simple test project.
When an ember route is entered with a dynamic path, ember data will load the object preloaded in the store if it exists and not make a server request. For example:
App.SomethingRoute=Ember.route.extend({
model:function(params){
this.store.find("something",params.something_id)
}
})
My app is such that I don't want to perform updating of depend models server side(I will for simple relationships but there are other I want to just pull updated records from the server). So I have been able to solve the problem by incorporating a server request in the afterModel hook:
App.SomethingRoute=Ember.route.extend({
model:function(params){
this.store.find("something",params.something_id)
},
afterModel:function(model){
$.getJSON("/somethings/"+model.id).then(function(data){
var serialized_something=route.store.serializerFor("something").normalize(TaxProgram.Something,data.something)
route.store.update("something",serialized_something)
})
})
What I can't figure out is how to check to see if the model hook is actually called, and in that case not make an additional wasteful afterModel call. I could set a property on the route that contains this information but I was hoping that Ember had a method to do this. Any suggestions?
No, there is no specific provision in Ember to handle the situation you describe.
In a similar situation I did exactly what you said you want to avoid, which is to set a property to remember if the model hook had been called. beforeModel is a useful place to initialize that property.
However, your implementation of this notion is flawed, and you're replicating too much Ember Data logic in your afterModel hook. Instead, you should simply consider using unload to remove the model instance from the local store when unnecessary and force a refresh next time you do a find on it, or do a reload at the appropriate point to force the reload.
Why the 'Todos.ApplicationAdapter = DS.FixtureAdapter.extend();' replace to '
Todos.ApplicationAdapter = DS.LSAdapter.extend({
namespace: "todos-emberjs"
});
' can be achieved local stores?
what's the meaning of 'namespace: "todos-emberjs"'?
There are how much kinds of adapters? And I should how to use them? How to define an adapter?
(Check out the picture here to see where ADAPTER component fits in)
I just went through EmberJS tutorial recently and from what I understood:
1)What are EmberJS adapters?
The adapters are objects that take care of communication between your application and a server. Whenever your application asks the store for a record that it doesn't have cached, it will ask the adapter for it. If you change a record and save it, the store will hand the record to the adapter to send the appropriate data to your server and confirm that the save was successful.
2)What types of EmberJS adapters are available?
Right now I am only aware of DS.RESTAdapter which is used by default by the store (it communicates with an HTTP server by transmitting JSON via XHR), DS.FixtureAdapter(something like in-memory storage which is not persistent) and DS.LSAdapter(something like local-storage which is persistent).
3)Why LSAdapter instead of FixtureAdapter in Todos tutorial?
FixtureAdapter stores data in-memory and thus whenever you refresh your page, the data gets reassigned to initial values. But LSAdapter is available on github which uses persistent storage to store and retrieve data, hence enabling you to retain all the changes even after you refresh your page.
4)Why namespace: "todos-emberjs"?
If your JSON API lives somewhere other than on the host root, you can set a prefix that will be added to all requests. For example, if your JSON APIs are available at /todo-emberjs/ you would want it to be used as a prefix to all the URLs that you are going to call. In that case, set namespace property to todo-emberjs.
(Hope it helps, loving EmberJS btw !)
I am adding a JSON API to the Ember tutorial app found here with Ember-Data. The flow of the app goes like this: Load the website: App fetches todos from the API via a GET request.Add a todo: App add a new todo via a POST requestEdit the todo that was just added: Fails because although the todo is in the database, the app doesn't know about it, because it hasn't gotten the list of todos since the todo was added. What I'm thinking I need is to refresh the list of todos every time a new one is added. I've tried to do something like this, but it only observes a property.
Just use a Live Record Array
Takes a type and filter function, and returns a live RecordArray that
remains up to date as new records are loaded into the store or created
locally.
The callback function takes a materialized record, and returns true
if the record should be included in the filter and false if it should
not.
The filter function is called once on all records for the type when
it is created, and then once on each newly loaded or created record.
If any of a record's properties change, or if it changes state, the
filter function will be invoked again to determine whether it should
still be in the array.
IE
this.store.all('post')
this.store.filter('post', function(post){ return post.get('body').indexOf('ember')>=0;});
Example:
http://emberjs.jsbin.com/OxIDiVU/22/edit