angularjs的三目运算
前言:前几天写代码的时候遇到一个问题,有一个按钮,有“已关注”和“+关注”两种状态,需要对这两种状态的按钮的背景颜色进行区分,单后点击“已关注”按钮状态变成“+关注”,相反,点击“+关注”按钮变成“已关注”相应的背景颜色都需要发生改变。
点击事件里面改变按钮的背景颜色:
angular.element(path).css('background', 'blue');//改变按钮的背景颜色 path:按钮的路径
这个能实现点击的时候改变背景颜色,但是在最开始从数据库里面读出来的时候并没有进行区分,这样写也不适用于最初的区分,于是想到了三目运算,但是angualarjs的三目运算并没有写过,倒腾了半天,终于解决:
<button class="bottonflag botton1" ng-click="changeBtn(li.id)" style="{{li.flag === '已关注' ? 'background: blue' : 'background : pink'}}">{{li.flag}}</button>
通过按钮的值判断,如果值等于“已关注”就将背景颜色设为蓝色,否则背景颜色就为粉色,值得注意的是,这个外面要加“{{}}”,因为里面涉及到了从数据库里面都出来的值。
angularjs的三目运算的更多相关文章
- ng-class结合三目运算
ng-class文档:https://docs.angularjs.org/api/ng/directive/ngClass 但是在实际项目中可能会用到三目运算,实例如下: <ul> &l ...
- 【Python全栈笔记】03 [模块二] 16-17 Oct Set 集合,三目运算
Set 集合 set - unordered collections of unique elements 创建一个set/一个空set # create a new set set1 = {1,2, ...
- python函数,lambda表达式,三目运算,列表解析,递归
一.自定义函数 定义函数时,函数体不执行:只有在调用函数时,函数体才执行.函数的结构: 1. def 2. 函数名 3. 函数体 def func_name(): 函数体 4. 返回值 如果没有声明返 ...
- 三目运算的使用&bytes类型转str类型
一.三目运算的使用 就像c语言中有三目运算符一样,python中也有三目运算符,废话不多说直接上代码 a=3 c=4 b=a if a>c else c print(b) 意思就和 if a&g ...
- 三目运算:and/or 技巧
三目运算:and/or 技巧 and, or 联合起来有个小技巧: print 2 < 3 and True or False 说明: 如果 2 小于 3 了,则输出 True , ...
- js switch判断 三目运算 while 及 属性操作
三 目运算:如var a = 10: var b= 12: c = a>b ?a:b; 若成立执行a否则执行b var isHide = true; 若用if判断语句如下 if(isHide) ...
- day09三目运算
内容详细 1.三目运算(三元运算) v=前面 if 条件 else 后面 if 条件: v="前面" else: v="后面" #让用户输入值,如果值是整数,则 ...
- python运算符,数据类型,数据类型操作,三目运算,深浅拷贝
算数运算符: Py2中精确除法需要导入:from __future__ import division,(符由特 ,将来的.滴未省,除法) py3不需要导入 赋值运算符: 比较运算符: 成员运算符: ...
- Delphi中的三目运算函数有哪些?(XE10.2+WIN764)
相关资料:https://www.cnblogs.com/rogge7/p/6078903.html 问题现象:在做一个判断时突然想到了C++的三目运算,就在想Delphi中一共有几个? 问题处理: ...
随机推荐
- spring的IOC和AOP协同工作
看网络上的spring资料,基本都是在讲解IOC和AOP,但是二者是如何协同工作的,说的很少. 粗略调试了下BeanFactory的创建过程,发现是如图所示的大概过程.其中BeanPostProces ...
- backbonejs
前言: backbone由以下模块组成. 一.Event 监听事件,自定义事件.绑定到任何对象. http://www.css88.com/doc/backbone/#Events 这个是下面模块核心 ...
- Android--Activity(活动)
1. 安卓中的 Activity 大致等于桌面应用中的window 2. Activity 的生命周期由系统控制, 所以在开发时要假设 Activity 会被随时销毁掉的情况, 比如: 应用中有一个 ...
- 带你玩转JavaWeb开发之六-mysql基本语法详解及实例(2)
1.1.1 对数据库中表的记录进行操作(*****) 1.1.1.1 对数据库中表记录插入操作 [语法] 向数据库表中插入某些列:insert into 表名 (列名1,列名2,列名3-) ...
- OC的类别(分类)和拓展
一.分类: 1.适用范围 当你已经封装好了一个类(也可能是系统类.第三方库),不想在改动这个类了,可是随着程序功能的增加需要在类中增加一个方法,这时我们不必修改主类,只需要给你原来的类增加一 ...
- oracle 解锁
解决方法如下: 1:查V$DB_OBJECT_CACHE SELECT * FROM V$DB_OBJECT_CACHE WHERE name='CRM_LASTCHGINFO_DAY' AND LO ...
- 常用git命令纪录
git branch xxx 新建分支xxx git branch -a 查看所有分支(包括远程) git remote add origin http://xxx.git 在本地添加一个远程仓库, ...
- 恢复 混淆后的 stacktrace 文件
./tools/proguard/bin/retrace.sh /Users/admin/Downloads/ProguardSample/app/build/outputs/mapping/rele ...
- Python基础、异常处理
一.概述 错误与异常概念 异常也是对象, 基于Exception类.内置异常 异常处理.流程 try/except/else 处理python或你触发的异常 try/fianlly 不管有没有异 ...
- lua 类支持属性不能被修改
背景 lua是类是借助表的来实现的, 类被定义后, 在使用场景下, 不希望被修改.如果被修改, 则影响的类的原始定义, 影响所有使用类的地方. 例如: --- router.lua class fil ...