Angularjs 依赖压缩及自定义过滤器写法


Posted in Javascript onFebruary 04, 2017

 具体代码如下所示:

<!DOCTYPE html>
<html>
<body>
<header>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="angular.min.js"></script>
  <script src="filter.js"></script>
</header>
<div ng-app="myApp">
    <div ng-controller="firstController">
      {{name | rHello}}
      <br>
      {{name | rHello:3:5}} // 三个参数分别是‘input 、n1、n2'
      <br>
      {{name | rJs}}
    </div>
</div>
<script type="text/javascript">
       var app=angular.module("myApp",['kk.filter']);  
       //kk.filter是将外部的过滤器进行依赖注入进行使用
 app.controller('firstController',['$scope',function($s){
/*上面这行代码是对依赖进行压缩, 在controller 内使用的。firstController是控制器名称,$scope必须是正确缩写不可以进行随意书写,不能压缩。而function($s),$s是$scope*的压缩写法,随意写/
   $s.name="Hello Angularjs";
 }]);
 app.filter('rHello',function(){
   return function(input,n1,n2){
      console.log(input);
      console.log(n1);
      console.log(n2);
      return input.replace(/Hello/, "你好");
   }
 });
</script>
</body>
</html>
//外部引入过滤器进行使用
var appFilter=angular.module(“kk.filter”,[]); 
//这里的kk.filter 是依赖名称 可以随便起。以及var appFilter的名字也是随便起
appFilter.filter(‘rJs',function(){ // 过滤器名称 随便起 
return function(input,n1,n2){ 
console.log(input); 
console.log(n1); 
console.log(n2); 
return input.replace(/js/, “JavaScript”); // 这是实现的是将js 改为JavaScript(字符串) 
} 
});

以上所述是小编给大家介绍的Angularjs 依赖压缩及自定义过滤器写法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
控制打印时页眉角的代码
Feb 08 Javascript
[原创]js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结
Mar 12 Javascript
js更优雅的兼容
Aug 12 Javascript
js判断浏览器类型及设备(移动页面开发)
Jul 30 Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
Mar 30 Javascript
JavaScript中的this使用详解
Jul 27 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
Sep 14 Javascript
值得学习的bootstrap fileinput文件上传工具
Nov 08 Javascript
servlet+jquery实现文件上传进度条示例代码
Jan 25 Javascript
jQuery滑动效果实现方法分析
Sep 05 jQuery
微信小程序实现动态显示和隐藏某个控件功能示例
Dec 14 Javascript
微信小程序使用二次贝塞尔曲线画波浪
Dec 25 Javascript
javascript实现复选框全选或反选
Feb 04 #Javascript
JavaScript获取当前时间向前推三个月的方法示例
Feb 04 #Javascript
javascript表单正则应用
Feb 04 #Javascript
JS中的phototype详解
Feb 04 #Javascript
详解JavaScript RegExp对象
Feb 04 #Javascript
JS查找字符串中出现最多的字符及个数统计
Feb 04 #Javascript
JavaScript获取中英文混合字符串长度的方法示例
Feb 04 #Javascript
You might like
PDO版本问题 Invalid parameter number: no parameters were bound
2013/01/06 PHP
解析PHP自带的进位制之间的转换函数
2013/06/08 PHP
php常用hash加密函数
2014/11/22 PHP
php判断数组中是否存在指定键(key)的方法
2015/03/17 PHP
WIN8.1下搭建PHP5.6环境
2015/04/29 PHP
PHP微信红包API接口
2015/12/05 PHP
PHP封装的非对称加密RSA算法示例
2018/05/28 PHP
用javascript实现点击链接弹出&quot;图片另存为&quot;而不是直接打开
2007/08/15 Javascript
使用EXT实现无刷新动态调用股票信息
2008/11/01 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
2014/02/12 Javascript
jquery删除ID为sNews的tr元素的内容
2014/04/10 Javascript
JavaScript Promise 用法
2016/06/14 Javascript
ES6新特性之变量和字符串用法示例
2017/04/01 Javascript
第一个Vue插件从封装到发布
2017/11/22 Javascript
vue中的数据绑定原理的实现
2018/07/02 Javascript
Vuepress 搭建带评论功能的静态博客的实现
2019/02/17 Javascript
小程序实现左滑删除效果
2019/07/25 Javascript
mpvue网易云短信接口实现小程序短信登录的示例代码
2020/04/03 Javascript
Vue Object.defineProperty及ProxyVue实现双向数据绑定
2020/09/02 Javascript
vue3+typeScript穿梭框的实现示例
2020/12/29 Vue.js
[01:20:38]完美世界DOTA2联赛 GXR vs IO 第一场 11.07
2020/11/09 DOTA
python中使用urllib2获取http请求状态码的代码例子
2014/07/07 Python
python处理html转义字符的方法详解
2016/07/01 Python
Python Web编程之WSGI协议简介
2018/07/18 Python
pytorch 实现在预训练模型的 input上增减通道
2020/01/06 Python
苹果中国官方网站:Apple中国
2016/07/22 全球购物
Beauty Expert美国/加拿大:购买奢侈美容产品
2018/12/05 全球购物
银行个人求职自荐信范文
2013/12/16 职场文书
美国探亲签证邀请信
2014/02/05 职场文书
学校工作推荐信范文
2014/07/11 职场文书
数学教育专业求职信
2014/07/22 职场文书
2016入党积极分子党课学习心得体会
2015/10/09 职场文书
适合毕业生创业的项目怎么找?
2019/08/08 职场文书
python基础之文件处理知识总结
2021/05/23 Python
Spring整合Mybatis的全过程
2021/06/28 Java/Android
微软官方消息,在 2023 年 4 月 11 日之后微软将不再为 Office 2013 和 Skype for Business 2015 提供安全更新
2022/04/21 数码科技