angularJs自定义过滤器实现手机号信息隐藏的方法


Posted in Javascript onOctober 08, 2018

如下所示:

<div ng-app="module" ng-controller="ctrl">
 <table border="1" width="600">
  <tr>
   <td>编号</td>
   <td>姓名</td>
   <td>手机号</td>
  </tr>
  <tr ng-repeat="(k,v) in data">
   <td>{{v.id}}</td>
   <td>{{v.name}}</td>
   <td>{{v.mobile|truncate:4}}</td>
  </tr>
 </table>
</div>
<script>
 var m = angular.module('module', []);
/*自定义过滤器truncate*/
 m.filter('truncate',function(){
  return function(mobile,len){
   len = len?len:3;
   return mobile.substr(0,11-len)+new String('*').repeat(len);
  }
 });
 m.controller('ctrl', ['$scope', '$filter', function ($scope, $filter) {
  $scope.data = [
   {id: 1, name: '张三', mobile: '14567654445'},
   {id: 2, name: '李四', mobile: '13910959565'},
   {id: 3, name: '王五', mobile: '13232343425'},
  ];
 }]);
</script>

效果图:

angularJs自定义过滤器实现手机号信息隐藏的方法

以上这篇angularJs自定义过滤器实现手机号信息隐藏的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
超级24小时弹窗代码 24小时退出弹窗代码 100%弹窗代码(IE only)
Jun 11 Javascript
jQuery学习笔记之jQuery选择器的使用
Dec 22 Javascript
最佳JS代码编写的14条技巧
Jan 09 Javascript
js实现的折叠导航示例
Nov 29 Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
Jan 13 Javascript
JavaScript前端图片加载管理器imagepool使用详解
Dec 29 Javascript
jQuery ready()和onload的加载耗时分析
Sep 08 Javascript
javascript中json基础知识详解
Jan 19 Javascript
单行 JS 实现移动端金钱格式的输入规则
May 22 Javascript
基于对象合并功能的实现示例
Oct 10 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
Apr 23 Javascript
使用jquery实现轮播图效果
Jan 02 jQuery
angular中子控制器向父控制器传值的实例
Oct 08 #Javascript
对angularjs框架下controller间的传值方法详解
Oct 08 #Javascript
对angularJs中controller控制器scope父子集作用域的实例讲解
Oct 08 #Javascript
CKEditor4配置与开发详细中文说明文档
Oct 08 #Javascript
浅谈angularJs函数的使用方法(大小写转换,拷贝,扩充对象)
Oct 08 #Javascript
angularJs复选框checkbox选中进行ng-show显示隐藏的方法
Oct 08 #Javascript
jquery.param()实现数组或对象的序列化方法
Oct 08 #jQuery
You might like
一个显示某段时间内每个月的方法 返回由这些月份组成的数组
2012/05/16 PHP
PHP错误Warning:mysql_query()解决方法
2015/10/24 PHP
PHP检测数据类型的几种方法(总结)
2017/03/04 PHP
PHP命令Command模式用法实例分析
2018/08/08 PHP
javascript call方法使用说明
2010/01/11 Javascript
IE event.srcElement和FF event.target 功能比较
2010/03/01 Javascript
Js中的onblur和onfocus事件应用介绍
2013/08/27 Javascript
jQuery.event兼容各浏览器的event详细解析
2013/12/18 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
2014/04/17 Javascript
jQuery实现返回顶部功能适合不支持js的浏览器
2014/08/19 Javascript
angularJS与bootstrap结合实现动态加载弹出提示内容
2015/10/16 Javascript
AngularJS ngModel实现指令与输入直接的数据通信
2016/09/21 Javascript
对比分析Django的Q查询及AngularJS的Datatables分页插件
2017/02/07 Javascript
bootstrap精简教程_动力节点Java学院整理
2017/07/14 Javascript
详解ES6之用let声明变量以及let loop机制
2017/07/15 Javascript
jQuery Collapse1.1.0折叠插件简单使用
2017/08/28 jQuery
全站最详细的Vuex教程
2018/04/13 Javascript
JavaScript new对象的四个过程实例浅析
2018/07/31 Javascript
js正则取值的结果数组调试方法
2018/10/10 Javascript
vue.js iview打包上线后字体图标不显示解决办法
2020/01/20 Javascript
js实现九宫格抽奖
2020/03/19 Javascript
vue2.x 对象劫持的原理实现
2020/04/19 Javascript
[02:37]2015国际邀请赛选手档案—LGD.Xiao8
2015/07/28 DOTA
解决Python 遍历字典时删除元素报异常的问题
2016/09/11 Python
python进程管理工具supervisor的安装与使用教程
2017/09/05 Python
Python实现字符串反转的常用方法分析【4种方法】
2017/09/30 Python
python http接口自动化脚本详解
2018/01/02 Python
python使用正则来处理各种匹配问题
2019/12/22 Python
python实现音乐播放器 python实现花框音乐盒子
2020/02/25 Python
Python 列表推导式需要注意的地方
2020/10/23 Python
详解如何修改jupyter notebook的默认目录和默认浏览器
2021/01/24 Python
介绍一下Ruby中的对象,属性和方法
2012/07/11 面试题
违反交通安全法检讨书
2014/10/24 职场文书
民事和解协议书格式
2014/11/29 职场文书
公司感谢信范文
2015/01/22 职场文书
幼儿园教师教学反思
2016/03/02 职场文书