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 相关文章推荐
jQuery的实现原理的模拟代码 -3 事件处理
Aug 03 Javascript
form.submit()不能提交表单的错误原因及解决方法
Oct 13 Javascript
javascript实现控制浏览器全屏
Mar 30 Javascript
利用jQuery的动画函数animate实现豌豆发射效果
Aug 28 Javascript
jquery.Callbacks的实现详解
Nov 30 Javascript
微信小程序实现图片预加载组件
Jan 18 Javascript
浅谈$_FILES数组为空的原因
Feb 16 Javascript
Angularjs验证用户输入的字符串是否为日期时间
Jun 01 Javascript
JS实现根据指定值删除数组中的元素操作示例
Aug 02 Javascript
vue项目前端埋点的实现
Mar 06 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
Mar 30 Javascript
js实现拖拽与碰撞检测
Sep 18 Javascript
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
简单的php文件上传(实例)
2013/10/27 PHP
PHP实现防盗链的方法分析
2017/07/25 PHP
PHP PDOStatement::execute讲解
2019/01/31 PHP
php常用日期时间函数实例小结
2019/07/04 PHP
比较全的JS checkbox全选、取消全选、删除功能代码
2008/12/19 Javascript
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
2009/11/27 Javascript
javascript 精粹笔记
2010/05/09 Javascript
jquery 倒计时效果实现秒杀思路
2013/09/11 Javascript
jquery append()方法与html()方法的区别及使用介绍
2014/08/01 Javascript
jQuery使用之处理页面元素用法实例
2015/01/19 Javascript
javascript闭包的理解
2015/04/01 Javascript
JavaScipt选取文档元素的方法(推荐)
2016/08/05 Javascript
Javascript农历与公历相互转换的简单实例
2016/10/09 Javascript
JQuery页面随滚动条动态加载效果的简单实现(推荐)
2017/02/08 Javascript
Angular.js自定义指令学习笔记实例
2017/02/24 Javascript
微信小程序之前台循环数据绑定
2017/08/18 Javascript
js实现一个简单的MVVM框架示例
2018/01/15 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
JS实现购物车基本功能
2020/11/08 Javascript
python使用reportlab实现图片转换成pdf的方法
2015/05/22 Python
使用Python的PIL模块来进行图片对比
2016/02/18 Python
Python字符串、整数、和浮点型数相互转换实例
2018/08/04 Python
Python实现数据结构线性链表(单链表)算法示例
2019/05/04 Python
Django中使用session保持用户登陆连接的例子
2019/08/06 Python
Python tkinter之ComboBox(下拉框)的使用简介
2021/02/05 Python
Tech21美国/加拿大:英国NO.1防摔保护壳品牌
2018/01/20 全球购物
Vans(范斯)新西兰官方网站:美国原创极限运动品牌
2020/09/19 全球购物
如何减少垃圾回收让内存更加有效使用
2013/10/18 面试题
物流专业大学的自我评价
2014/01/11 职场文书
市场专员岗位职责
2014/02/14 职场文书
2014年班级工作总结范文
2014/12/23 职场文书
单位接收函范文
2015/01/30 职场文书
试用期自我评价怎么写
2015/03/10 职场文书
2019毕业论文致谢词
2019/06/24 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python
口袋妖怪冰系十大最强精灵,几何雪花排第七,第六类似北极熊
2022/03/18 日漫