博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
3.5 Templates -- Binding Element Attributes(绑定元素属性)
阅读量:7071 次
发布时间:2019-06-28

本文共 1094 字,大约阅读时间需要 3 分钟。

一、概述

除了正常的文本,你可能还需要你的模板中包含的HTML元素的属性绑定到controller

1. 例如,设想controller有一个属性包含一个图片的URL:

生成的HTML:

2. 如果你绑定的是一个布尔值,它将会添加或者移除一个特定的属性。例如:

如果isAdministratortrue,Handlebars将会生成如下HTML元素:

如果是false

二、 添加data属性

1. 默认的,view helpers不接受data属性。例如:

{
{#link-to "photos" data-toggle="dropdown"}}Photos{
{/link-to}}{
{input type="text" data-toggle="tooltip" data-placement="bottom" title="Name"}}

渲染为HTML:

2. 有两种办法可以让它支持data属性。

  • 一种是添加一个属性绑定到view,例如Ember.LinkComponent或者Ember.TextFielw对特定的属性来说:
  • export default Ember.LinkComponent.reopen({  attributeBindings: ['data-toggle']});export default Ember.TextField.reopen({  attributeBindings: ['data-toggle', 'data-placement']});

    HTML:

  • 你也可以在base view中自动绑定data属性:
  • export default Ember.View.reopen({  init() {    this._super();    var self = this;    // bind attributes beginning with 'data-'    Ember.keys(this).forEach(function(key) {      if (key.substr(0, 5) === 'data-') {        self.get('attributeBindings').pushObject(key);      }    });  }});

转载于:https://www.cnblogs.com/sunshineground/p/5152885.html

你可能感兴趣的文章
网页小工具集合
查看>>
seaJS源码
查看>>
Windows 8 学习笔记(一)
查看>>
UINavigationController的常用属性和方法
查看>>
centos7zabbix-agen安装
查看>>
CORS FOR AspNetCore
查看>>
iOS—仿微信单击放大图片
查看>>
noteexpress使用指南
查看>>
C从控制台(stdin)输入带空格的字符串到字符数组中
查看>>
Codeforces Round #428 A. Arya and Bran【模拟】
查看>>
【设计模式】抽象工厂模式
查看>>
OO第四次博客
查看>>
面试STAR法则
查看>>
spark 操作hbase
查看>>
[LeetCode]Balanced Binary Tree
查看>>
Sqlitekit 封装管理
查看>>
8、log4e
查看>>
volatile 可见性的模拟分析示例
查看>>
2016.04.22-2016.04.28这周工作时间和内容
查看>>
jSignature签字板保存为图片
查看>>