I am currently starting to learn to use Ember.js for web app development. Currently there is something quite basic which I have not yet been able to achieve. Link to an external url like www.google.com or whatever. This is what I have:
HTML
<body> <script type="text/x-handlebars"> <div> Hello, <strong>{{firstName}} {{lastName}}</strong>! </div> {{#linkTo google}}Google{{/linkTo}} </script> </body> $(document).ready(function() { //alert("HELLO WORLD"); window.App = Ember.Application.create(); App.ApplicationController = Ember.Controller.extend({ firstName: "Trek", lastName: "Glowacki", googleURL: "www.google.com/ncr" }); App.Router.map(function() { this.route("google", { path: "www.google.com" }); });
});
When the link renders it does work but it goes to this address: E:/EMBERJS/index.html#/www.google.com
Any hints would be greatly appreciated. I can't believe I haven't figured this out on my own but a little outside help can't hurt.
Regards,
Ox
You don't want to be using the linkTo
helper for this. The linkTo
helper is used for transition to other states within your Ember.JS application, whereas you're attempting to move people away from your application.
There are two methods you can use:
This will bind your targetUrl
to your anchor, but it won't update if the URL is changed.
<a target="_blank" href="{{unbound view.targetUrl}}">Google</a>
The next approach will bind to the anchor, and it will update that anchor accordingly if you update the targetUrl
property on the object:
<a target="_blank" {{bindAttr href="view.targetUrl"}}>Google</a>
Here's a JSFiddle for you: http://jsfiddle.net/zscff/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With