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 数据绑定的更多相关文章

  1. Angular4.0从入门到实战打造在线竞拍网站学习笔记之四--数据绑定&管道

    Angular4.0基础知识之组件 Angular4.0基础知识之路由 Angular4.0依赖注入 数据绑定 数据绑定允许你将组件控制器的属性和方法与组件的模板连接起来,大大降低了开发时的编码量. ...

  2. Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定

    Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定 创建 angular 组件 https://github.com/angular/angular- ...

  3. angular4.0中form表单双向数据绑定正确姿势

    issue:用[(ngModel)]="property"指令双向数据绑定,报错. reason1:使用ngModel绑定数据需要注入FormsModule模块,在app.modu ...

  4. Angular4学习笔记(五)- 数据绑定、响应式编程和管道

    概念 Angular中的数据绑定指的是同一组件中控制器文件(.ts)与视图文件(.html)之间的数据传递. 分类 流向 单向绑定 它的意思是要么是ts文件为html文件赋值,要么相反. ts-> ...

  5. angular4自定义组件非input元素实现ngModel双向数据绑定

    在angular里我们一般都是给input元素添加[(ngModel)]="value"实现数据双向绑定,如果想实现自定义的组件上实现ngModel双向数据绑定应该怎么办呐... ...

  6. angular4+中的数据绑定

    1,基本的属性绑定,下面的两种形式是一样的 2.dom属性和html属性 3.两者关系的进一步总结 4.dom属性绑定 5.html属性绑定

  7. AngularJs学习笔记2-控制器、数据绑定、作用域

    上次分享完该系列文章后有朋友也建议说1.x版本除了维护也没有必要学习,可以学习2.0开始学习,我也知道1.x无论是从性能还是架构上都没有2.x好,但是我想因为现在也有一些朋友还在用1.x版本,因为1. ...

  8. Angular4.0学习笔记 从入门到实战打造在线竞拍网站学习笔记之二--路由

    Angular4.0基础知识见上一篇博客 路由 简介 接下来学习路由的相关知识 本来是不准备写下去的,因为当时看视频学的时候感觉自己掌握的不错 ( 这是一个灰常不好的想法 ) ,过了一段时间才发现An ...

  9. Angular4.0从入门到实战打造在线竞拍网站学习笔记之三--依赖注入

    Angular4.0基础知识之组件 Angular4.0基础知识之路由 依赖注入(Dependency Injection) 正常情况下,我们写的代码应该是这样子的: let product = ne ...

随机推荐

  1. sublime 使用快捷键

    Goto Anything  快捷键 Ctrl+P (支持模糊匹配) 1,查找文件   在查找框中输入文件目录(知道目录直接输入目录,不知道目录直接输入页面名称即可.支持模糊匹配)  index.ht ...

  2. HTML和CSS前端教程03-CSS文本样式

    目录 1.CSS颜色-建议就用十六进制 2.CSS长度的度量单位-建议就用px 3.CSS文本样式 3.1. 字体属性 3.1. 文本样式 1.CSS颜色-建议就用十六进制 p{ color: #ff ...

  3. 总结:当静态路由和BGP同时存在时路由优选BGP的两种方法

    结论: 方法一.配置BGP协议的外部优先级比静态路由的优先级高,优选BGP. 优点:配置简单. 缺点:全局生效,如果用户有针对某个静态路由想提高优先级,不受动态路由影响,则针对每个静态路由都需要人为提 ...

  4. pthread_once()函数详解

    转自:pthread_once()函数详解 pthread_once()函数详解   在多线程环境中,有些事仅需要执行一次.通常当初始化应用程序时,可以比较容易地将其放在main函数中.但当你写一个库 ...

  5. pwn with glibc heap(堆利用手册)

    前言 ​ 对一些有趣的堆相关的漏洞的利用做一个记录,如有差错,请见谅. ​ 文中未做说明 均是指 glibc 2.23 ​ 相关引用已在文中进行了标注,如有遗漏,请提醒. 简单源码分析 ​ 本节只是简 ...

  6. nginx多server配置记录

    直接在配置文件(/etc/nginx/nginx.conf)中添加如下代码: server { listen 8080; server_name 192.168.100.174:8080; root ...

  7. MS SQL自定义函数IsPositiveInteger

    判断字符串是否为正整数,0开始的的数字不算. SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO CREATE FUNCTION [dbo].[svf_I ...

  8. 设置TIMESTAMP和DATETIME的自动初始化及自动更新

    最近有一个关于MySQL版本升级的事,涉及到一些关于时间类型的细节问题需要查明,因此到官网找到相关文章,翻出来比较方便自己理解,博客这里也贴一下. 参考官网网址: https://dev.mysql. ...

  9. “软到不行”的WWDC2018

    转载请标明来源:https://www.cnblogs.com/zhanggui/p/9154542.html 简介 一年一度的WWDC于北京时间6月5号凌晨1点在加利福利亚州圣何塞的麦克恩利会议中心 ...

  10. JavaScript对象类型之创建对象

    引言 JavaScript中,可以通过对象直接量,关键字new(ECMAScript 5中的)Object.create(),函数来创建对象. 对象直接量 JavaScript中使用对象直接量来创建对 ...