ionic2/3 ngClass 和ngStyle用法
来源:互联网 发布:js改变a标签的href 编辑:程序博客网 时间:2024/06/06 09:34
ngClass第一个参数为类名称,第二个参数为boolean值,如果为true就添加第一个参数的类
[ngClass]="{'text-success':index == 0}"
ngStyle没有判断
<div [ngStyle]="{'background-color':'green'}"></<div>
ngStyle有判断
<div [ngStyle]="{'background-color':username === 'zxc' ? 'green' : 'red' }"></<div>
例如:
<ion-col col-4 *ngFor="let item of rmpp ;let i = index" (click)="choose(item.id)"> <button id="{{item.id}}" ion-button small outline [ngClass]="{'active':i === 0}">{{item.name}}</button></ion-col>
<ion-col col-4 *ngFor="let item of rmpp ;let i = index" (click)="choose(item.id)"> <button id="{{item.id}}" ion-button small outline [ngStyle]="{'color':i=== 0 ? 'green' : 'red' }">{{item.name}}</button></ion-col>
阅读全文
0 0
- ionic2/3 ngClass 和ngStyle用法
- angular2中ngstyle和ngclass的用法
- angular2 [ngStyle] [ngClass]的用法
- angular [ngStyle] [ngClass]的用法
- angular2指令解读:ngFor,ngIf,ngSwitch,ngStyle,ngClass用法
- AngularJs ngClass、ngClassEven、ngClassOdd、ngStyle
- Angular4中[ngClass]、[ngStyle]的基本使用
- ngClass
- ionic2开发的仿外卖点餐系统(Ionic2+Angular2...包含CSS3飞入购物车效果和各种组件用法)
- android和ionic2
- ionic2中ion-segment用法
- ionic2/3 MD5加密
- ionic2/3 tabs控件
- ionic2
- ionic2 -- 环境搭建和ionic2项目目录介绍
- ionic2 cordova插件用法之二
- 巧用ngStyle改变样式
- ionic2/3 base64编码/解码
- isEmpty与isBlank的区别
- nodejs入门(06)-模块系统
- PG锁查询sql
- Android 开发问题解决(持续更新...)
- this关键字的使用
- ionic2/3 ngClass 和ngStyle用法
- Java 数据类型在实际开发中应用
- PHP中 ->和=>的区别是什么
- Redis CPU告警分析
- 关于C++ const 的全面总结
- Struts2框架02
- 4-4 求自定类型元素的平均 (10分) 本题要求实现一个函数,求N个集合元素S[]的平均值,其中集合元素的类型为自定义的ElementType。 函数接口定义: ElementType Aver
- Tomcat引起的中文乱码问题
- C++优先级