EmberJS - 链接

{{link-to}} 组件可用于创建到路由的链接。

语法

{{#link-to route}}
   //code here
{{/link-to}}

下表列出了链接的属性 -

序号	链接和说明
1	多个片段对于多个片段，如果为嵌套路由，你可以提供每个片段的模型或标识符。
2	使用 Link-to 作为内联帮助器将 link-to 作为内联组件使用，方法是将链接文本来当做第一个参数提供给帮助器。
3	在链接上添加其他属性可以在创建链接时添加其他属性。
4	替换历史记录条目通过使用 link-to 帮助器，可以在路由之间移动时将条目添加到浏览器的历史记录中。

示例

以下示例演示如何链接到不同的路由。创建一个新路由并将它命名为 note，然后打开 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 TutorialsPoint</h4>
{{outlet}}

输出

运行 ember 服务器，你将收到以下输出 -

当你单击该链接时，它将显示来自模板文件中的文本，如下面的屏幕截图所示 -

emberjs_template.htm

打印页面

序号	链接和说明
1	多个片段对于多个片段，如果为嵌套路由，你可以提供每个片段的模型或标识符。
2	使用 Link-to 作为内联帮助器将 link-to 作为内联组件使用，方法是将链接文本来当做第一个参数提供给帮助器。
3	在链接上添加其他属性可以在创建链接时添加其他属性。
4	替换历史记录条目通过使用 link-to 帮助器，可以在路由之间移动时将条目添加到浏览器的历史记录中。