Emberjs-temp-links
提供:Dev Guides
EmberJS-リンク
_ \ {\ {link-to}} _コンポーネントを使用して、ルートへのリンクを作成できます。
構文
{{#link-to route}}
//code here
{{/link-to}}
次の表は、リンクのプロパティを示しています-
S.No. | Links & Description |
---|---|
1 |
複数のセグメントの場合、ルートがネストされている場合、各セグメントのモデルまたは識別子を提供できます。 |
2 |
Using Link-to as an Inline Helper ヘルパーへの最初の引数としてリンクテキストを提供することにより、インラインコンポーネントとして_link-to_を使用します。 |
3 |
Adding Additional Attributes on a Link リンクの作成中に追加の属性をリンクに追加できます。 |
4 |
_link-to_ヘルパーを使用して、ルート間を移動しながら、ブラウザーの履歴にエントリを追加できます。 |
例
次の例は、異なるルートにリンクする方法を示しています。 新しいルートを作成し、メモとして名前を付け、_router.js_ファイルを開いてURLマッピングを定義します-
import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend ({
location: config.locationType,
rootURL: config.rootURL
});
Router.map(function() {
this.route('note');
});
export default Router;
次のコードで_app/templates/_の下に作成された_application.hbs_ファイルを開きます-
{{#link-to 'note'}}Click Here{{/link-to}}
{{outlet}}
上記のリンクをクリックすると、次のテキストを含む_note.hbs_ファイルが開きます-
<h4>Welcome to finddevguides</h4>
{{outlet}}
出力
エンバーサーバーを実行すると、次の出力が表示されます-
リンクをクリックすると、次のスクリーンショットのようにテンプレートファイルのテキストが表示されます-