I am new to emberJS and I am trying to open a new page like 'www.google.com' from one of my page where I have my link specified in my HBS template like below.
{{#link-to 'applications.google' tagName="li"}}Google{{/link-to}}
I tried to insert the {{action}} helper inside the tag also, and wrote an action method in the controller, yet it didn't work. Not sure. Please help.
You can use normal anchor tag with full URL with protocol.
<a href='http://www.google.com'> example </a>
I did added an action helper in the HRef tag like
And in the Ember Controller I included an action as
actions: {
openGoogle() {
window.open("google.com");
}
}
It works!!!
Related
I'm trying the use the link-to helper to open a dynamic link in a new tab, but so far it's not working.
I'm using LinkView for that and I can see the target attribute in my link, but it doesn't open the url in a new tab but in the current one.
Here is my code :
The template :
{{#link-to "page.edit" id target="_blank"}}EDIT{{/link-to}}
The LinkView :
Ember.LinkView.reopen({
attributeBindings: ['target']
});
This is what it generate when I inspect it :
<a id="ember468" class="ember-view" href="#/pages/1/edit" target="_blank">EDIT</a>
Do I miss something?
Thanks for the help.
The attribute target is already part of Ember.LinkView. Get rid of the reopen code and the rest is working: http://emberjs.jsbin.com/sumiwa/1/edit
I am getting some data from server and in my controller I am trying to display that in list format. What I want to do is to allow the user to click on any item of that list and call an action behind it. Here is my js code.
for(var index in posts) {
if (posts.hasOwnProperty(index)) {
console.log(1);
var attr = posts[index];
//console.log(attr);
/*$("ul#previous_recipients").append('<li class="list-group-item"><label>'+attr.name+'' +
'</label><a href="javascript:void(0)" class="close g-green" {{action "aa"}}>Add</a></li>');*/
$("ul#previous_recipients").append(Ember.Handlebars.compile('<li class="list-group-item"><label>{{attr.name}} </label>Add</li>'));
}
}
How to call action on it? {{action "test"}} is not being called.
You have to compile the handlebars template and define the test action inside actions hash in the same controller.
$("ul#previous_recipients").append(Ember.Handlebars.compile('
<li class="list-group-item"><label>{{attr.name}} </label>
Add</li>
'));
You have to move this html code from controller to a handlebars file,that will be good.
What you need to do is create an ember view and give it a
templateName
property which will contain your html and handlebars expression. Alternately, you could, inside the view say
defaultTemplate: Em.Handlebars.compile(/*your handlebars and html markup here*/)
using Jquery to do things like this is not the ember way of doing things.
I have a template that has a a tag with an id and based on id the css applies style to this a href. I would like to use the LinkTo helper for this tag and id set to the one it has now. Helper LinkTo in Ember generates a link. I need to set an id on this a link for example:
<a href='...' id=xyz>
How to acomplish it?
You can just pass HTML attributes to the linkTo helper:
{{#linkTo 'some.route' id="xyz"}}Link text{{/linkTo}}
I currently have this template
{{#each model}}
{{#linkTo object this}}{{name}}{{/linkTo}}
{{/each}}
which creates
<a href="path/#/objectid"/>
This does not cause a model reload, but a page refresh with that url does.
How can I make a link in my template with a full url?
<a href="path/objects/{{id}}">{{name}}</>
does not work, because {{id}} does not seem to fully resolve inside the quotation marks, so I get something like:
path/objects/<script id="metamorph-5-start....
I have seen answers hinting at adjusting setupController, but what if I do not want to reload the model every time? It would be nice to have control over this from the templating side, i.e. using {{#linkTo}} when no reload is needed and some other trick when a reload is needed. Is there an easy way to create a full url based on model parameters in handlebars?
This is may not be a full solution to your problem, but as for this part:
does not work, because {{id}} does not seem to fully resolve inside the quotation marks, so I get something like:
there is help:
<a href="path/objects/{{unbound id}}">{{name}}</>
Using unbound does not put the script metamorph tag's around the property.
Hope it helps you to tackle down your problem.
I figured it out - although without changing the url, so I am still using a normal {{#linkTo...}}.
As mentioned in How to reload an ember data record?, record.reload() can be used - it works for me like this:
App.ObjectRoute = Ember.Route.extend({
...
setupController: function(controller, model) {
var record = App.Object.find(model.id);
record.reload();
controller.set("model", record);
},
});
If there was an easy alternative using a modified url, I would still be interested in finding out.
I'm a newbie in ember, and i can't find anywhere where i can append a format to my links.
I have to show a pdf coming from my server, and in rails i would do it in this way:
<%= link_to "Print", document, format: pdf %>
asssuming that my server is actually responding at documents/:id.pdf, how can i build this link in ember, when i'm inside a cycle of this type?
{{#each document in controller}}
...print document link here...
{{/each}}
thanks,
Marco
Ember's {{linkTo}} is for internal links.
If you want to link to an external resource, you should either user {{bindAttr}} on an <a> tag, or write a custom Handlebars helper.