- EmberJS 教程
- EmberJS - 首页
- EmberJS - 概览
- EmberJS - 安装
- EmberJS - 核心概念
- 创建并运行应用程序
- EmberJS - 对象模型
- EmberJS - 路由器
- EmberJS - 模板
- EmberJS - 组件
- EmberJS - 模型
- EmberJS - 管理依赖项
- EmberJS - 应用程序关注点
- EmberJS - 配置 Ember.js
- EmberJS - Ember 检查器
- EmberJS 实用资源
- EmberJS - 快速指南
- EmberJS - 实用资源
- EmberJS - 讨论
模板:在链接中添加额外属性
借助 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 服务器;您将收到以下输出 −
接下来,单击 点击以获取水果 列表,它将显示模板文件中的以下文本 −
emberjs_template.htm
广告