angular指令ng-class巧用
什么是ng-class
ng-class最大的妙用就是可以根据你的逻辑表达式。来添加或移除对应的class
ng-class是angular.js里面内置的一个指令。
项目中,有时候,我们需要根据需求来切换不同的class
function bb($scope){
$scope.ss="className";
}
<div class="{{ss}}"></div>
这种方式是scope变量绑定方式,个人觉得妙用谈不上,还不如直接写class=什么的
字符串方式,比较长用
function bu($scope) {
$scope.ss= true;
}
<div ng-class="{true: 'a', false: 'b'}[ss]"></div>
根据你的逻辑去切换 ss的true或者false,来显示对应的cass
对象key/valu处理
function Ctr($scope) {
}
<div ng-class {'selected': isSelected, 'car': isCar}"></div>
当 isSelected = true 则增加selected class,当isCar=true,则增加car class。以此类推。
angular指令ng-class巧用的更多相关文章
- Angular CLI ng常用指令整理
一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...
- angular指令之complie和link不得不说的故事
angular指令比较晦涩难懂的就是complie和link字段了,什么时候该用complie?什么时候该用link?总是很难分别清楚.当理解了指令的真正编译原理的时候,就会发现这相当的简单. ng怎 ...
- angular指令深度学习篇
angular指令深度学习-过滤器 limitTo ... <body ng-app="app" > <div ng-controller="myCtr ...
- Angular指令渗透式理解
通过一段时间对angular指令的使用,理解了angular指令的意义,下面逐一介绍一下. ng-app:定义一个angualr模块,表示angular作用的范围,如下代码: ng-app在html标 ...
- Angular4 后台管理系统搭建(9) - 用自定义angular指令,实现在服务端验证
最近这段时间发现,北京这用angular4 或 angular2的公司很少.几乎是没有.很担心自己是不是把精力放到了不应该的地方.白耽误了时间.但是随着我对新版angular框架理解的加深.个人感觉a ...
- angular指令大全
这篇文章的案例都是来自官方,引用的cdn来自bootcss, 因为angular的官方网站被屏了, 所以要翻, 不过我把整个文档下回来了,方便大家下载可以点击: 打开下载英文版 angular的指令 ...
- Angular指令(一)
Angular开发者手册重点翻译之指令(一) 创建自定义的指令 这个文章将解释什么需要在自己的angularjs应用中创建自己的指令,以及如何实现它. 什么是指令 在高的层面上讲,指令是DOM元素中的 ...
- angular指令
转自:http://www.cnblogs.com/rohelm/p/4051437.html 对于指令,可以把它简单的理解成在特定DOM元素上运行的函数,指令可以扩展这个元素的功能. 首先来看个完整 ...
- angular指令的compile,prelink 和 postlink以及controller
一. 指令模板选项有complie和link两个字段,两者之间存在如下关系: 当compile字段存在时,link字段将被忽略,compile函数的返回值将作为link字段. 当compile不存在, ...
随机推荐
- Mongo汇总问题
1. 数据 /* 5 */ { "_id" : ObjectId("5902f7ca2b3fe442d60a0946"), "code" : ...
- CodeSmith生成实体的分页读取规则
首先.我得向咱们博客园提个意见,能不能我写的东西就给预保存下呢?刚才我写半天,只因为这个不给力的IE浏览器死了,导致我白写了,如果这要是那个大神直接在这上面写的非常有技术含量的贴着会因此而丢失实在是有 ...
- webUI自动化测试框架---”pyswat“介绍
webUI自动化测试框架---"pyswat"介绍 大家好我是lamecho 辣么丑,今天给大家介绍一款web自动化测试框架pyswat. "pyswat"是 ...
- [笔记]scanf的使用(主要是针对char)
学的是C++,用cin cout也用的很顺溜,写自己的类时重载"<<"与">>"运算符也很爽,但是发现在刷算法竞赛题时,cin cout ...
- 通过一步步创建sharded cluster来认识mongodb
mongodb是目前使用非常广泛的nosql(not only sql)之一,在db engines上排名非常靠前,下图是5月份的排名: 可以看到前面四个都是传统的关系型数据库,而mongodb在no ...
- 微信小程序开发流程
2017年1月9日,张小龙在2017微信公开课Pro上发布的小程序正式上线,一夜之间,小程序可谓家喻户晓,但通过接下来的几个月的观察,微信小程序并没有想象中的那么火爆.进入4月以来,微信小程序团队进行 ...
- Java中的Classpath
classpath实际上就是编译后的,以classes文件夹为起点的路径各种path获取到的路径的区别 Demo.class.getResource("");//得到的是Demo类 ...
- GreenDao 使用二
1.创建一个实体类 1 Entity note = schema.addEntity("Note"); 默认表名就是类名,也可以自定义表名 1.dao.setTableName(& ...
- OpenCV探索之路(七):霍夫变换
我们如何在图像中快速识别出其中的圆和直线?一个非常有效的方法就是霍夫变换,它是图像中识别各种几何形状的基本算法之一. 霍夫线变换 霍夫线变换是一种在图像中寻找直线的方法.OpenCV中支持三种霍夫线变 ...
- .net很简介的操作json数组
using Newtonsoft.Json.Linq;//添加的引用,Newtonsoft.dll可以到guget里面下载 string json="json字符串" JObjec ...