[AngularJS] Extract predicate methods into filters for ng-if and ng-show
Leaking logic in controllers is not an option, filters are a way to refactor your code and are compatible with ng-if and ng-show.
<div ng-if="main.currentUser | user:'isAdmin'">
Admin div
</div>
<div ng-if="main.currentUser | user:'isntAdmin'">
Standard user div
</div>
var app = angular.module('App', []); app.controller('MainCtrl', function() {
var currentUser = { rights: [] };
function setAdmin(){
resetAdmin();
currentUser.rights.push('admin');
}
function resetAdmin(){
currentUser.rights = [];
} this.currentUser = currentUser;
this.setAdmin = setAdmin;
this.resetAdmin = resetAdmin;
}); app.filter('user', function(){
var rules = {
isAdmin: function(user){
return user.rights.indexOf('admin') !== -1;
},
isntAdmin: function(user){
return !rules.isAdmin(user);
}
}; return function(user, rule){
return rules[rule](user);
};
});
[AngularJS] Extract predicate methods into filters for ng-if and ng-show的更多相关文章
- [AngularJS] Adding custom methods to angular.module
There are situations where you might want to add additional methods toangular.module. This is easy t ...
- Part 14 ng hide and ng show in AngularJS
ng-hide and ng-show directives are used to control the visibility of the HTML elements. Let us under ...
- Angular6之ng build | ng build --aot | ng build --prod 差异
由于写了大半年的项目终于要告一段落并且即将进行第二阶段优化开发,emmm 基础版本已经二十多个模块了,必不可少的优化是很重要的,尽管项目上使用多层嵌套懒加载,但是在首屏加载的时候,任然很慢啊,因为一直 ...
- 在库中使用schematics——ng add与ng update
起步 创建一个angular库 ng new demo --create-application=false ng g library my-lib 可见如下目录结构 ├── node_modules ...
- AngularJS + RequireJS
http://www.startersquad.com/blog/AngularJS-requirejs/ While delivering software projects for startup ...
- 使用AngularJS实现简单:全选和取消全选功能
这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...
- [后端人员耍前端系列]AngularJs篇:使用AngularJs打造一个简易权限系统
一.引言 上一篇博文已经向大家介绍了AngularJS核心的一些知识点,在这篇博文将介绍如何把AngularJs应用到实际项目中.本篇博文将使用AngularJS来打造一个简易的权限管理系统.下面不多 ...
- [AngularJS] AngularJS系列(1) 基础篇
目录 什么是AngularJS? 为什么使用/ng特性 Hello World 内置指令 内置过滤器 模块化开发 一年前开始使用AngularJS(以后简称ng),如今ng已经出2了.虽说2已完全变样 ...
- Angularjs,WebAPI 搭建一个简易权限管理系统 —— Angularjs 前端主体结构(五)
目录 前言 Angularjs名词与概念 Angularjs 基本功能演示 系统业务与实现 WebAPI项目主体结构 Angularjs 前端主体结构 6 Angularjs 前端主体结构 6.1 A ...
随机推荐
- C++默认参数值函数
1.默认参数值的函数 C++语言允许在定义函数时给其中或某些形式参数(形参)指定默认值,方法就是在相应的形参后面写上“=默认值”,如果省略了对应位置上的实参的值,则在执行被调函数时以该形参的默认值进行 ...
- activemq启动不起来,报错Address already in use: JVM_Bind
之前莫名其妙的activemq怎么都启动不起来后来多方查询是因为widows 的ICS服务. 解决方案是,我的电脑上邮件,选择服务,然后在服务中找到Internet Connection Sharin ...
- Spring 3整合Quartz 2实现定时任务一:常规整合 (基于maven构建)
最近工作中需要用到定时任务的功能,虽然Spring3也自带了一个轻量级的定时任务实现,但感觉不够灵活,功能也不够强大.在考虑之后,决定整合更为专业的Quartz来实现定时任务功能. 首先,当然是添加依 ...
- sap中用函数增加断点(break point)
如果在增强程序中,每次调试都要去程序里面设置断点很麻烦,为了解决这个问题,可以用下面的两个方法: 1: if sy-uname eq 'XXXX' "XXX 为账号名字 break ...
- js 介绍
createjs 工作内容:html5游戏开发岗位要求:1. 熟悉HTML5特性, 掌握canvas开发技能;2.能独立的搭建出易扩展,高效,强壮,通用的前端底层框架;3.熟悉常用的JS开发框架或工具 ...
- Code First:如何实现一个主类中包含多个复类
假设我们在程序中要用到的类的结构是这样的,这里比较特别的是B在A中出现了最少两次 public class B { [Key] public int Id { get; set; } public s ...
- TiDB:支持 MySQL 协议的分布式数据库解决方案
[编者按]TiDB 是国内 PingCAP 团队开发的一个分布式 SQL 数据库.其灵感来自于 Google 的 F1,TiDB 支持包括传统 RDBMS 和 NoSQL 的特性.在国内 ITOM 管 ...
- Python还是很重要的,不能丢。学习IF和WHILE
number = 23 guess = int(input('Enter an interger : ')) if guess == number: print('Congratulations, y ...
- java的File类的 delete方法删不掉文件的原因分析
先举几个可以删除掉文件和删除不掉文件的例子(先在F盘创建test1.txt文件,然后可以直接拷贝代码到IDE执行),最后总结下原因: 例子一:下面的例子毫无疑问是能够删除掉文件的 import jav ...
- POJ_3321_APPLE_TREE
poj上面的一道求子树上苹果的题目,网上看了很多题解,下面我来回忆一下,基本来源于大神的微博,http://blog.csdn.net/zhang20072844,我来做个搬运工.先将树的n条边上节点 ...