模板:在链接中添加额外属性



借助 helper link-to,您可以在链接上添加其他属性。

语法

{{link-to 'link-text' 'route-name' class = "btn-primary"}}

示例

本示例演示如何在链接上添加其他属性。创建一个命名为 info 的路由,并打开文件 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');
});

export default Router;

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

//Adding the additional attributes on a link as class = "btn btn-primary" 
{{link-to 'Click For Fruits List' 'info' class = "btn btn-primary"}}
{{outlet}}

单击“点击以获取水果清单”链接时,页面应打开包含以下代码的 info.hbs 文件 −

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

输出

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

Ember.js Template Additional Attribute

接下来,单击 点击以获取水果 列表,它将显示模板文件中的以下文本 −

Ember.js Template Additional Attribute
emberjs_template.htm
广告