当前位置: 首页 > 文档资料 > EmberJS 入门教程 >

Links

优质
小牛编辑
131浏览
2023-12-01

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

语法 (Syntax)

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

下表列出了链接的属性 -

S.No.链接和说明
1Multiple Segments

对于多个段,如果路由是嵌套的,则可以为每个段提供模型或标识符。

2使用Link-to作为内联助手

通过提供链接文本作为帮助程序的第一个参数,将链接用作内联组件。

3在链接上添加其他属性

您可以在创建链接时添加其他属性。

4Replacing History Entries

您可以使用link-to帮助程序在路径之间移动时向浏览器的历史记录添加条目。

例子 (Example)

以下示例显示如何链接到不同的路由。 创建一个新路由并将其命名为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 xnip</h4>
{{outlet}}

输出 (Output)

运行ember服务器,您将收到以下输出 -

Ember.js模板链接

当您单击该链接时,它将显示模板文件中的文本,如以下屏幕截图所示 -

Ember.js模板链接