angular4 数据绑定
HTML属性绑定
1.基本Html属性绑定
- <td [attr.colspan]="tableColspan">something</td>
2.css类绑定
- <div [class]="someEle">something</div>
- <div class="aaa,bbb" [class.ccc]="isSpec">something</div>
- <div [ngClass]="{aaa:isA,bbb:isB}">something</div>
3.样式绑定
- <button [style.color]="ispec ? 'red' : 'green'">something</button>
数据绑定
HTML属性和DOM属性的关系
1.少量html属性和DOM属性之间有着1:1的映射,如id
2.有些HTML属性没有对应的DOM属性,如 colspan
3.有些DOM属性没有对应的HTML属性,如 textContent
4.就算名字相同,html属性和DOM属性也不是同样的东西
5.HTML属性的值指定了初始值;DOM属性的值表示当前值。
DOM属性的值可以改变;HTML属性的值不能改变
6.模板绑定是通过DOM属性和事件来工作的,而不是HTML属性
angular4 数据绑定的更多相关文章
- Angular4.0从入门到实战打造在线竞拍网站学习笔记之四--数据绑定&管道
Angular4.0基础知识之组件 Angular4.0基础知识之路由 Angular4.0依赖注入 数据绑定 数据绑定允许你将组件控制器的属性和方法与组件的模板连接起来,大大降低了开发时的编码量. ...
- Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定
Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定 创建 angular 组件 https://github.com/angular/angular- ...
- angular4.0中form表单双向数据绑定正确姿势
issue:用[(ngModel)]="property"指令双向数据绑定,报错. reason1:使用ngModel绑定数据需要注入FormsModule模块,在app.modu ...
- Angular4学习笔记(五)- 数据绑定、响应式编程和管道
概念 Angular中的数据绑定指的是同一组件中控制器文件(.ts)与视图文件(.html)之间的数据传递. 分类 流向 单向绑定 它的意思是要么是ts文件为html文件赋值,要么相反. ts-> ...
- angular4自定义组件非input元素实现ngModel双向数据绑定
在angular里我们一般都是给input元素添加[(ngModel)]="value"实现数据双向绑定,如果想实现自定义的组件上实现ngModel双向数据绑定应该怎么办呐... ...
- angular4+中的数据绑定
1,基本的属性绑定,下面的两种形式是一样的 2.dom属性和html属性 3.两者关系的进一步总结 4.dom属性绑定 5.html属性绑定
- AngularJs学习笔记2-控制器、数据绑定、作用域
上次分享完该系列文章后有朋友也建议说1.x版本除了维护也没有必要学习,可以学习2.0开始学习,我也知道1.x无论是从性能还是架构上都没有2.x好,但是我想因为现在也有一些朋友还在用1.x版本,因为1. ...
- Angular4.0学习笔记 从入门到实战打造在线竞拍网站学习笔记之二--路由
Angular4.0基础知识见上一篇博客 路由 简介 接下来学习路由的相关知识 本来是不准备写下去的,因为当时看视频学的时候感觉自己掌握的不错 ( 这是一个灰常不好的想法 ) ,过了一段时间才发现An ...
- Angular4.0从入门到实战打造在线竞拍网站学习笔记之三--依赖注入
Angular4.0基础知识之组件 Angular4.0基础知识之路由 依赖注入(Dependency Injection) 正常情况下,我们写的代码应该是这样子的: let product = ne ...
随机推荐
- php编写生成酷炫验证码
<?php $im=imagecreate(200,100);//生成画布 imagecolorallocate($im,0,0,0);//背景色 $white=imagecoloralloca ...
- 22 , CSS 构造颜色、背景与图像
1. 设定颜色 2. 背景使用 3. 图像使用 1.设定颜色 红色的几种合法定义; #f00; #ff0000; Red; Rgb(255,0,0); Rgb(100%,0%,0%); 2.十六进制三 ...
- 博弈论进阶之Multi-SG
Multi-Nim 从最简单的Nim模型开始 它的定义是这样的 有\(n\)堆石子,两个人可以从任意一堆石子中拿任意多个石子(不能不拿)或把一堆数量不少于\(2\)石子分为两堆不为空的石子,没法拿的人 ...
- java环境配置记录
1.启动Eclipse时报错:Failed to load the JNIshared library 这种问题是因为Java与Eclipse两个软件的位数不一样,一个是32位,一个是64位,存在冲突 ...
- 【代码笔记】Web-CSS-CSS Text(文本)
一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- 【AO笔记】Addins的Toolbar 添加一条分割线
在XAML中,给Item标签添加separator属性,需要从哪里打分割线,就将其设置为true即可.如下图所示: 如紫色框住的灰色竖线所示. 默认separator属性是false的,这个小东西极其 ...
- 从.Net到Java学习第十二篇——SpringBoot+JPA提供跨域接口
从.Net到Java学习系列目录 最近又撸了半个月的前端代码,做app离线存储,然后又花了一周去将过去的wcf项目转webapi,java又被落下了,总感觉我特么像斗地主中的癞子牌,变来变去..... ...
- Grafana 利用Grafana Variables变量配置快速切换不同主机的图表数据展示
用Grafana Variables变量配置快速切换不同主机的图表数据展示 by:授客 QQ:1033553122 测试环境 需求描述 操作步骤 结果展示 测试环境 influxdb-1.5.2. ...
- eos 创建两对的公钥和私钥, 钱包,交易所转账到主网,主网到交易所
在ubuntu18.04上安装EOS的目的: 在ubuntu中,进行eos源码编译和安装 在不联网的安全环境下,用eos官方的命令行工具,创建自己的公钥和私钥 用eos官方的命令行工具,创建钱包,执行 ...
- Swift JSON字符串和字典以及数组的互转
1.JSONString转换为字典 // JSONString转换为字典 func getDictionaryFromJSONString(jsonString:String) ->NSDict ...