1.4 多个属性绑定-数组的形式
1、数组的形式
1 |
|
1 |
|
2、绑定结果
2. style绑定
| 绑定类型 | 语法 | 输入类型 | 输入值范例 |
|---|---|---|---|
| 单一样式绑定 | [style.width]=“width” | string undefined null | “100px” |
| 带单位的单一样式绑定 | [style.width.px]=“width” | number undefined null | 100 |
| 多个样式绑定 | [style]=“styleExpr” | string {[key: string]: string undefined null} | “width: 100px; height: 100px” {width: ‘100px’, height: ‘100px’} |
2.1 单个属性
1、单个属性的形式
1 |
|
1 |
|
2、绑定结果
2.2 带有单位的单个属性
1、带有单位
1 |
|
2、绑定结果
2.3 多个属性的绑定
1 |
|
1、字符串
1 |
|
2、对象
1 2 3 |
|
3、结果图
更多编程相关知识，请访问：编程视频！！
以上就是浅谈Angular10中class和style绑定的详细内容，更多文章请关注木庄网络博客！
相关阅读 >>
浅谈angular cli工具如何从零搭建并运行一个简单项目
更多相关阅读请进入《angular10》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
