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实现用方向键控制层的上下左右移动
Jan 13 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
May 05 Javascript
JS实现图片高亮展示效果实例
Nov 24 Javascript
基于JS组件实现拖动滑块验证功能(代码分享)
Nov 18 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
详解如何用webpack打包一个网站应用项目
Jul 12 Javascript
解决vue.js在编写过程中出现空格不规范报错的问题
Sep 20 Javascript
Vue SSR 组件加载问题
May 02 Javascript
laravel-admin 与 vue 结合使用实例代码详解
Jun 04 Javascript
JavaScript forEach中return失效问题解决方案
Jun 01 Javascript
JS轮播图的实现方法2
Aug 25 Javascript
Vue包大小优化的实现(从1.72M到94K)
Feb 18 Vue.js
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
高分R级DC动画剧《哈莉·奎茵》第二季正式预告首发
2020/04/09 欧美动漫
Smarty变量调节器失效的解决办法
2014/08/20 PHP
PHP实现动态柱状图改进版
2015/03/30 PHP
PHP可变变量学习小结
2015/11/29 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
JavaScript的目的分析
2007/01/05 Javascript
jquery乱码与contentType属性设置问题解决方案
2013/01/07 Javascript
js 3种归并操作的实例代码
2013/10/30 Javascript
jQuery中scrollTop()方法用法实例
2015/01/16 Javascript
一个php+js实时显示时间问题
2015/10/12 Javascript
干货分享:让你分分钟学会javascript闭包
2015/12/25 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
2017/02/10 Javascript
nodeJS实现路由功能实例代码
2017/06/08 NodeJs
详解React开发必不可少的eslint配置
2018/02/05 Javascript
Vue中android4.4不兼容问题的解决方法
2018/09/04 Javascript
websocket4.0+typescript 实现热更新的方法
2019/08/14 Javascript
[02:34]2016完美“圣”典风云人物:BurNIng专访
2016/12/10 DOTA
Python中pip安装非PyPI官网第三方库的方法
2015/06/02 Python
Django2.1.3 中间件使用详解
2018/11/26 Python
python3发送邮件需要经过代理服务器的示例代码
2019/07/25 Python
Python ORM框架Peewee用法详解
2020/04/29 Python
学习python需要有编程基础吗
2020/06/02 Python
没编程基础可以学python吗
2020/06/17 Python
Python加载数据的5种不同方式(收藏)
2020/11/13 Python
孤独星球出版物:Lonely Planet Publications
2018/03/17 全球购物
开普敦通行证:Cape Town Pass
2019/07/18 全球购物
英国婚礼商城:Wedding Mall
2019/11/02 全球购物
捷克家具销售网站:SCONTO Nábytek
2020/01/02 全球购物
zooplus德国:便宜地订购动物用品、动物饲料、动物食品
2020/05/06 全球购物
员工自我鉴定
2013/10/09 职场文书
语文教学感言
2014/02/06 职场文书
材料员岗位职责
2015/02/10 职场文书
学校财务管理制度
2015/08/04 职场文书
幼儿园教师教育随笔
2015/08/14 职场文书
Redis基本数据类型Zset有序集合常用操作
2022/06/01 Redis