EmberJS - 模板 link-to 作为内联帮助程序

您可以通过将链接文本作为帮助程序的第一个参数，将 link-to 用作内联组件。

语法

点击获取 {{#link-to 'link1'}}更多信息{{/link-to}}，
{{link-to 'link text' 'link2'}} 的信息。

示例

以下示例通过指定帮助程序的第一个参数，展示了如何使用 link-to 作为内联组件。创建两个名为 info 和 record 的路由，并打开 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('info');
   this.route('record');
});

export default Router;

使用以下代码打开在 app/templates/ 下创建的文件 application.hbs 文件 −

Click for the {{#link-to 'info'}}Fruits{{/link-to}} information, for the documentation 
{{link-to 'Click for records''record'}}
{{outlet}}

当您单击"Fruits"链接时，页面应打开包含以下代码的 info.hbs 文件 −

<p>Some Fruits</p>
<ul>
   <li>Orange</li>
   <li>Banana</li>
</ul>
{{outlet}}

如果您点击点击记录链接，页面应该打开record.hbs文件，其中包含以下代码 −

<p>Some Records</p>
<ul>
<li>Orange.doc</li>
<li>Banana.doc</li>
</ul>
{{outlet}}

输出

运行 ember 服务器；您将收到以下输出 −

当您单击 info 时，它将显示来自模板文件的以下文本 −

当您单击 Click for records 时，它将显示来自模板文件的以下文本 −

emberjs_template.html