I've got a problem getting the linkTo Handlebar helper to work
I've got this route setup:
this.resource("contact", function(){
this.route('new');
this.route('show', { path: "/:contactid" });
this.route('edit', { path: "edit/:contactid" });
}
in my template I have the following code:
{{#each entry in controller.entries}}
{#linkTo "contact.show" entry href="true" }}test {{firstname}} {{lastname}}{{/linkTo}}
{{/each}}
The resulting link though is /contact/show/undefined
What am I doing wrong?
Sidenote: I'm not using Ember.Data and the models.
Ember expects that parameters follow the convention modelname_id, so the route should be changed to:
this.resource("contact", function(){
this.route('new');
this.route('show', { path: "/:contact_id" });
this.route('edit', { path: "edit/:contact_id" });
}
This should work, assuming that entry.get("id") is defined.
See http://emberjs.com/guides/routing/specifying-a-routes-model/ for detail.
Implement serialize in the router to override the default behavior of id. For example I have a route that looks like:
this.route( 'date', { path: '/:begin/:end'} );
and the route will look like
Em.Route.extend( {
serialize: function( model, params ) {
return { begin: model.begin.valueOf(), end: model.end.valueOf() };
}
} );
Related
in my router i have
this.route('users', { path: '/users' }, function(){
this.route('show', { path: '/:user_id' }, function(){
this.route('history',{ path: '/history' });
});});
in my template i want to link to the users/1/history url
but {{#link-to "users.show.history" user}}History{{/link-to}}
is not working.
So what is the correct way to write this link to?
How can I create a route to support nested URL having format "/objects/1/fields/1".
I was able to achieve this with the following code but it violates the pod structure of my code.
this.route('fieldShow', {path: '/objects/:object_id/fields/:field_Id'});
I ended up solving this by passing the path like this:
this.route('fields', {path: 'objects/:object_id/fields'}, function() {
this.route('show', {path: '/:field_id'});
});
You try this:
Router.map(function() {
this.route('fieldshow', function() {
this.route('edit');
this.route('object', { path: ':object_id' }, function() {
this.route('field', { path: ':field_id' });
});
});
});
this probably helps you. you may ignore this.route('edit'); this is just to show you how it works
Using the example route defined below how can a link be defined to /post/123/comments?
Router.map(function() {
this.route('post', { path: '/post/:post_id' }, function() {
this.route('edit');
this.route('comments', { resetNamespace: true }, function() {
this.route('new');
});
});
});
Since resetNamespace: true is set on comments, the route post.comments does not exist. Otherwise the following would work.
{{#link-to "post.comments" "123"}}Link{{/link-to}}
You have to link directly to comments:
{{#link-to "comments" "123"}}Link{{/link-to}}
It will transition to /post/123/comments after you click it. See working demo.
I'm having an issue making a nested route available in Ember.js
App.Router.map(function() {
this.resource('home', { path: '/' });
this.resource('form', { path: '/forms/:form_id' }, function() {
this.route('newRecord');
});
I have the parent route...
App.FormRoute = Ember.Route.extend({....
Which is working.
Next I have...
App.FormNewRecordRoute = Ember.Route.extend({
afterModel: function() {
this.set('newRecord', this.modelFor('form');
}
});
Normally I get the URL with something like localhost/forms/9087
With the child route I'm getting localhost/undefined/newRecord
I'm guessing that 'localhost/undefined/newRecord' is coming from something like {{#link-to 'newRecord'}}. It should probably be {{#link-to 'form.newRecord'}}.
In ember.js pre 4 I'm trying to achieve a routing which responds to the following routes (among others):
/contact/[id]
/contact/edit
/contact/new
/contact/list
/contact/list/my
/contact/list/team
/contact/list/groups
The first routes (up to list) I can manage:
The variants of list (my/team/groups) is where I'm struggling. I just get a: "No route machted the URL '/contact/list/my' error when calling it.
I've tried multiple variations on how to achieve this kind of nesting. This is my current attempt:
App.Router.map(function()
{
this.route("index");
this.resource("contact", function(){
this.route('new');
this.route('show', { path: "/:contact_id" });
this.route('edit', { path: "edit/:contact_id" });
});
this.resource("contact.list", function(){
this.route("index");
this.route("my");
});
});
Looking at the App.Router.router.recognizer.names: I see the following output:
contact.edit: Object
contact.index: Object
contact.list.index: Object
contact.list.my: Object
contact.new: Object
contact.show: Object
index: Object
__proto__: Object
Any ideas?
This seems to work for me:
App.Router.map(function()
{
this.route("index");
this.resource("contact", function(){
this.route('new');
this.route('show', { path: "/:contact_id" });
this.route('edit', { path: "edit/:contact_id" });
this.resource("contact.list", { path: "list/" },function(){
this.route("index");
this.route("my");
});
});
});