[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 ...
随机推荐
- statusBar显示白色字体
设置状态栏显示颜色为白色. a. 在info.plist中,添加一项,选择View controller-based status bar appearance(箭头下拉中最后一项),设置为no; b ...
- html 5 中的 6位 十六进制颜色码 代表的意思
人的眼睛看到的颜色有两种: ⒈ 一种是发光体发出的颜色,比如计算机显示器屏幕显示的颜色: ⒉ 另一种是物体本身不发光,而是反射的光产生 十六进制颜色码 的颜色,比如看报纸和杂志上的颜色. 我们又知道任 ...
- WPF WebBroswer可以用到的接口
http://pinvoke.net/default.aspx/Interfaces.DWebBrowserEvents2 [ComImport, SuppressUnmanagedCodeSecur ...
- git stash的使用
https://git-scm.com/docs/git-stash 在git svn的时候使用,提交记录的时候,有部分文件的修改不需要commit. 在向svn进行git svn dcommit的时 ...
- AS 学习笔记 for in 和 for each in
for in 的速度比 for each in 慢很多倍 ~~ var myArray:Array = new Array(); myArray["a"] = "zer ...
- 微软开放技术发布开源 Jenkins 插件以将 Windows Azure Blob 服务用的开作存储库
发布于 2014-02-10 作者 陈 忠岳 持续集成 (CI) 的历史源远流长, 其宗旨在于软件团队在敏捷环境中不断将他们的工作整合为持续构建.管理 CI 进程的工具已存在一段时间.过去几年中 ...
- CodeForces 573A Bear and Poker
题目链接:http://codeforces.com/problemset/problem/573/A 题目大意:此题要求一组数中的元素乘以2或者乘以3后得到的数都一样,其实就是判断这些数除去2和3这 ...
- (已解决 7.8号)leecode 分词利用词典分词 word break
不戚戚于贫贱,不汲汲于富贵 ---五柳先生 Given a string s and a dictionary of words dict, determine if s can be se ...
- vi同类品
nvi 更纯正,接近原始的vi command argument-F don't copy whole file, may faster-S secure help (quick refe ...
- Linux I2C设备驱动编写(二)
在(一)中简述了Linux I2C子系统的三个主要成员i2c_adapter.i2c_driver.i2c_client.三者的关系也在上一节进行了描述.应该已经算是对Linux I2C子系统有了初步 ...