（一）数据绑定
未标题-1.jpg
1.数据绑定
未标题-1.jpg
添加一些键盘事件
(kerup.enter)按键并回车
(kerup.space)按键并空格
(kerup.contro)按键并ctrl
(kerup.shift)按键并shift
(kerup.alt)按键并alt
（二）DOM属性绑定
<img [src]=''imgUrl''>
<img src = "{{imgUrl}}"
DOM属性和HTML属性。（input）
上面是DOM属性，下面为HTML属性。
html属性表示初始值，（不变）
dom属性表示现在值。（可变）
未标题-1.jpg
三张图说明关系
未标题-1.jpg
未标题-1.jpg
（三）HTML属性绑定
1.基本HTML属性绑定
未标题-1.jpg
2.CSS类绑定
未标题-1.jpg
3.样式绑定
未标题-1.jpg
（四）双向绑定,一般元素加上也没用（input有用）
[(ngModel)] = "name"
（五）管道（可以链试使用）（asyns异步管道先不说）
未标题-1.jpg
未标题-1.jpg
（五）2自定义管道
使用cli工具（注意他有声明但是cli已经替你处理了）
ng g pipe 管道位置和名称
args----参数（可选）
value -----原始值
未标题-1.jpg
（六）响应式编程
1.主模块里引入ReactiveFormsModule
未标题-1.jpg
2.组件模块上添加
import 'rxjs/Rx'3.申明变量变量类型为FormControl
未标题-1.jpg
4.html上数据绑定
未标题-1.jpg
5.构造函数上订阅事件使数据绑定到另一个变量上
image.png
网友评论