I try to use the Restadapter from emberjs to call my api under 'http://local.ember.api' but I can't get any data. After some respearch I didn't get it working. Here is my code:
I created a file under app/application with the name adapter.js with this code:
import DS from 'ember-data';
import $ from 'jquery';
import config from '../config/environment';
var ApplicationAdapter;
ApplicationAdapter = DS.RESTAdapter.extend({
host: 'http://local.ember.api',
namespace: 'api/v1'
});
var ApplicationSerializer;
ApplicationSerializer = DS.RESTSerializer.extend({});
export default ApplicationAdapter;
export default ApplicationSerializer;
and under app/models I have a user.js with this code:
import Ember from 'ember';
import DS from 'ember-data';
var User = DS.Model.extend({});
export default User;
my app/router.js looks like this:
import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend({
location: config.locationType
});
Router.map(function() {
this.route('users');
this.route('user', {path: '/user/:user_id'});
});
export default Router;
and my app/routes/user.js:
import Ember from 'ember';
export default Ember.Route.extend({
model: function(params) {
return this.store.find('user', params.user_id);
}
});
with this setup I get this error:
Error: Assertion Failed: You tried to find a record but your adapter (for test-app#model:user:) does not implement 'findRecord'
when I create a file under app/services with the name store.js and this code:
import Ember from 'ember';
import DS from 'ember-data';
var Store;
Store = DS.Store.extend({});
export default Store;
I get this error:
Error: Assertion Failed: You tried to find a record but your adapter (for test-app#model:user:) does not implement 'findRecord'
when I create a function with the name 'findRecord' in the store.js-File:
Store = DS.Store.extend({
findRecord: function() {}
});
I get no result. Where is the mistake?
I think the problem is that you are calling find on the Store, but the according to the documentation you should be calling findRecord as there is no find. Hence, the error message.
When you create the findRecord method, it's probably being called but since you don't return anything... well you don't get any data back. If you console.log there, it's probably being called.
Edit:
I found the line where that error happens in ember-data's source code (although it's from master). But looking at the source code form 1.13.15 it should have the find method and it should give you a warning.
Can you setup an EmberTwiddle that reproduces the issue?
Related
I'm working on an Ember website with a Node JS Express API. I'm using ember-ajax to connect to the API.
EDIT:
Ember version is 1.13
Ember Data : 1.13.15
The problem is Ember does the AJAX call as if it was directed towards localhost:4200 (Ember) when it should be sent towards localhost:9029 (Express). Of course, this throws a 404.
How do I make it so it sends the request to the API instead of itself? I've tried --pxy after ember s but that does not work. It seems like it's ignoring the files I created. I'm very new to Ember.
app/services/ajax.js
import Ember from 'ember';
import AjaxService from 'ember-ajax/services/ajax';
export default AjaxService.extend({
namespace: '/api',
host: 'http://localhost:9029',
trustedHosts: [
'http://localhost:9029',
]
});
app/routes/test.js
import Ember from 'ember';
import AjaxService from 'ember-ajax/services/ajax';
export default Ember.Route.extend({
ajax: Ember.inject.service(),
model() {
return this.get('ajax').request('/gimmieDatDate', {method: 'POST'});
}
});
Could you write out the full command you used to run the server? Something like
ember s --proxy http://localhost:9029
should work.
You should specify the host in your (application) adapter.
// app/adapters/application.js
export default DS.JSONAPIAdapter.extend({
host: 'https://api.example.com'
});
Docs: https://guides.emberjs.com/v2.4.0/models/customizing-adapters/#toc_host-customization
I'm trying define a Person class within an Ember-cli project which I can then call from within a service. I've got a basic service working that updates when various inputs are changed but I can't reference the Person class at all. This is what I currently have:
# app/models/person.js
import Ember from "ember";
var Person = Ember.Object.extend({
helloWorld: function() {
alert("Hi, my name is " + this.get('name'));
}
});
export default Person;
and in the router I've got:
# app/router.js
import Ember from 'ember';
import config from './config/environment';
import Person from './models/person';
var Router = Ember.Router.extend({
location: config.locationType,
model: function() {
return Person.create({
name: "Tom Dale"
});
}
});
I'm pretty sure it's referenced the "import Person" correctly because if it's wrong I see an error about the file not being found.
then in the service I've got:
# /app/services/calculator.js
import Ember from 'ember';
export default Ember.Service.extend({
init: function () {
// this gives "Person is not defined"
const person = new Person();
// this gives "Person is not defined"
const person = Person.create({ name: "Tom Jones" });
// this gives "store not defined"
const person = this.store.createRecord('person', { name: "Tom Jones" });
},
});
Any pointers on how I can access the Person class from the service would be greatly appreciated. Thanks!
I'll try to address what I think are some misunderstandings.
First off, you have a Person class but it isn't a DS.Model so you won't be able to use it through Ember Data (this.store).
Your router.js file is where you define your routes, as shown in the guides. You seem to be confusing it with how to specify a route's model? Pay close attention to the file paths in the code samples.
As for the service, Person is not defined because unlike your router.js code, you are not importing Person into the module. Imports are per-module, so you also need import Person from './models/person'; in your service. Check jsmodules.io for more information.
Ember Data's store is injected into Routes and Controllers only, that's why this.store is undefined in the Service. If you want to access the store, do the following:
export default Ember.Service.extend({
store: Ember.inject.service(),
init() {
const person = this.get('store').createRecord('person', { name: "Tom Jones" });
}
});
Mind you, the above should not work with the code you posted as Person isn't a DS.Model
You need to import Person in every file that references it.
Add import Person from './models/person'; to your service class.
I have this route configuration on my router.js
import Ember from 'ember';
import config from './config/environment';
var Router = Ember.Router.extend({
location: config.locationType
});
Router.map(function() {
this.route('about');
this.resource('posts');
});
export default Router;
and inside my routes folder I have this posts.js
import Ember from 'ember';
export default Ember.Route.extend({
model: function() {
return this.store.find('post');
}
});
and inside my model folder I have this ember-data model
import DS from 'ember-data';
export default DS.Model.extend({
title: DS.attr()
});
And here's my Adapter
import DS from 'ember-data';
export default DS.RESTAdapter.reopen({
namespace: 'api'
});
However whenever I access the resource(localhost:4200/posts) I receive this error
Error while processing route: posts Not Found ember$data$lib$adapters$rest$adapter$$default<.ajaxError#http://localhost:4200/assets/vendor.js:60763:35
ember$data$lib$adapters$rest$adapter$$default<.ajax/</hash.error#http://localhost:4200/assets/vendor.js:60838:37
jQuery.Callbacks/fire#http://localhost:4200/assets/vendor.js:3350:10
jQuery.Callbacks/self.fireWith#http://localhost:4200/assets/vendor.js:3462:7
done#http://localhost:4200/assets/vendor.js:9518:1
.send/callback#http://localhost:4200/assets/vendor.js:9920:8
NOTE:
I've also set up a mock http rest server using this command ember g http-mock post
Found the solution myself. Turns out the the mock I needed to create a mock with the same name as my resource that's configured in the router.js
so I created a new http mock using this one
ember g http-mock posts
in my case, Turns out that the route specified should be the same as the JSON you are retrieving.
Try to change this.resource('posts') to this.route('posts'). You don't need resources with latest version of ember.
Just converted my app to ember-cli, but I don't know how to use Ember.Application.register any more because register doesn't seem to be available when Application is started with extend rather than create.
import Ember from 'ember';
import App from 'myapp/app';
var AdminMyController = Ember.ObjectController.extend({
});
// THROWS ERROR HERE BECAUSE register isn't, uh...registered?
App.register('controller:adminMyController', AdminMyController, { singleton: false });
export default AdminMyController;
Previously, because App was a global, I could register this right in the same class.
Am I going to have to move all the register calls to an initializer so I can get access to the app instance?
I belive an initializer would do this for you. You'll need to create an initializers folder in your app directory (same level as controllers, templates, etc). This file should go there.
import Ember from 'ember';
var AdminMyController = Ember.ObjectController.extend({
...
});
export default {
name: 'adminMyController',
initialize: function (container, application) {
container.register('controller:adminMyController', AdminMyController, {singleton: false});
}
};
Hi I want extend my super route class something like this :
//routes/auth.js
export default Em.Route.extend({
someFunction:function(){
//code
}
});
//routes/test.js
export default App.AuthRoute.extend({
model: function(){
return this.someFunction(); //Call function from super class
}
});
routes/test.js doesnt work -white screen and nothing in console - I do not know naming conventions to get this.
You need to import any other modules that you reference first so that they can be resolved:
import AuthRoute from 'appkit/routes/auth';
export default AuthRoute.extend({
....
});