angular使用什么样的样式_Angular动态绑定样式及改变UI框架样式的方法小结

AngularJS 简介

AngularJS 是一个 JavaScript 框架。它可通过

AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。

AngularJS 是一个 JavaScript 框架

AngularJS 是一个 JavaScript 框架。它是一个以 JavaScript 编写的库。

AngularJS 是以一个 JavaScript 文件形式发布的，可通过 script 标签添加到网页中：

一：angular动态绑定样式

举个栗子：

isHideClass(index){

const data = this.tableData[index];

// if(data['532411351520251904'].value.valueText===''&&data['532411588670394368'].value.valueText===''

// &&data['532411670509654016'].value.valueText==='') {

// return 'hide_tr'

// }

let arr = [];

for (let i in data) {

arr.push(data[i]);

}

if(arr.every((val,idx)=>{

return val.value.valueText === ''

})){

return 'hide_tr'

}

}

hide_tr是类名，

.hide_tr{

display: none !important;

}

解释：ngClass要绑定的类名会在tr根据数据循环生成html的过程中调用组件中定义的isHideClass()方法，并把i(index)带过去让方法使用

根据方法逻辑返回的类名去绑定写好的样式isHideClass(index){return 'hide'}，这时候这个ngClass就绑定上了hide这个类名的样式

二：angular改UI框架样式(例子是蚂蚁金服的UI框架)

例子：

::ng-deep{

.ant-card-head-title{

font-weight: bold;

}

.ant-table-placeholder{

display: none;

}

.ant-card-body {

padding-bottom: 0px

}

.hide_tr{

display: none !important;

}

}

在要改的样式前面加上：：ng-deep，就可以改变框架定义好的样式

总结

以上所述是小编给大家介绍的Angular动态绑定样式及改变UI框架样式的方法小结，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！