web-dev-qa-db-ja.com

LinkToとHandleBarsを使用して外部URLにリンクする方法

私は現在、Webアプリ開発にEmber.jsを使用する方法を学び始めています。現在、私がまだ達成できていない非常に基本的なことがあります。 www.google.comなどの外部URLにリンクします。これは私が持っているものです:

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"
    });

});

});

リンクがレンダリングされると機能しますが、次のアドレスに移動します:E:/EMBERJS/index.html#/www.google.com

ヒントをいただければ幸いです。私は自分でこれを理解していないとは信じられませんが、少しの外部の助けが傷つくことはありません。

よろしく、

去勢牛

20
Oxnigarth

このためにlinkToヘルパーを使用する必要はありません。 linkToヘルパーは、Ember.JSアプリケーション内の他の状態への移行に使用されますが、アプリケーションから人々を遠ざけようとしています。

使用できる方法は2つあります。

  1. これにより、targetUrlがアンカーにバインドされますが、URLが変更されても更新されません。

    <a target="_blank" href="{{unbound view.targetUrl}}">Google</a>

  2. 次のアプローチはアンカーにバインドし、オブジェクトのtargetUrlプロパティを更新すると、それに応じてそのアンカーが更新されます。

    <a target="_blank" {{bindAttr href="view.targetUrl"}}>Google</a>

これがあなたのためのJSFiddleです: http://jsfiddle.net/zscff/

39
Wildhoney

言われたように、link-toヘルパーを使う必要はありません。単純なアンカータグを使用する必要があります<a> </a>

私はちょうど同じ問題を抱えていました。これを修正するには、アンカータグに注意する必要があります。
例えば。このようにリンクを入力すると<a href='www.example.com'> example </a>、Emberは次のリンクを生成します
localhost:4200/www.example.com

ただし、httpを追加すると、href属性にすべて問題ありません。
<a href='http://www.example.com'> example </a>
出力はwww.example.com

それが役に立てば幸い。

0
zhisme