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 相关文章推荐
js字符串的各种格式的转换 ToString,Format
Aug 08 Javascript
jquery弹出框的用法示例(2)
Aug 26 Javascript
JavaScript极简入门教程(三):数组
Oct 25 Javascript
整理JavaScript创建对象的八种方法
Nov 03 Javascript
Bootstrap中文本框的宽度变窄并且加入一副验证码图片的实现方法
Jun 23 Javascript
JavaScript简单实现合并两个Json对象的方法示例
Oct 16 Javascript
如何实现小程序tab栏下划线动画效果
May 18 Javascript
微信小程序云函数使用mysql数据库过程详解
Aug 07 Javascript
vue使用swiper.js重叠轮播组建样式
Nov 14 Javascript
js实现移动端吸顶效果
Jan 08 Javascript
vue.js使用v-model实现父子组件间的双向通信示例
Feb 05 Javascript
Vue左滑组件slider使用详解
Aug 21 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
Session的工作方式
2006/10/09 PHP
解析左右值无限分类的实现算法
2013/06/20 PHP
PHP APP微信提现接口代码
2018/09/30 PHP
心扬JS分页函数代码
2010/09/10 Javascript
Ubuntu 11.10 安装Node.js的方法
2011/11/30 Javascript
jquery基础教程之deferred对象使用方法
2014/01/22 Javascript
jquery ajaxSubmit 异步提交的简单实现
2014/02/28 Javascript
jQuery中prepend()方法用法实例
2014/12/25 Javascript
SpringMVC返回json数据的三种方式
2015/12/10 Javascript
Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码
2016/06/28 Javascript
JS使用正则表达式过滤多个词语并替换为相同长度星号的方法
2016/08/03 Javascript
Bootstrap对话框使用实例讲解
2016/09/24 Javascript
Angular2数据绑定详解
2017/04/18 Javascript
Vue键盘事件用法总结
2017/04/18 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
2018/06/24 Javascript
vue中将html字符串转换成html后遇到的问题小结
2018/12/10 Javascript
基于vue+uniapp直播项目实现uni-app仿抖音/陌陌直播室功能
2019/11/12 Javascript
JavaScript用document.write()输出换行的示例代码
2020/11/26 Javascript
零基础学Python(一)Python环境安装
2014/08/20 Python
Python中shutil模块的学习笔记教程
2017/04/04 Python
itchat和matplotlib的结合使用爬取微信信息的实例
2017/08/25 Python
Python开发中爬虫使用代理proxy抓取网页的方法示例
2017/09/26 Python
python进行TCP端口扫描的实现
2018/12/21 Python
Python类反射机制使用实例解析
2019/12/30 Python
打包PyQt5应用时的注意事项
2020/02/14 Python
keras.utils.to_categorical和one hot格式解析
2020/07/02 Python
HTML5 用动画的表现形式装载图像
2016/03/08 HTML / CSS
医院护士的求职信范文
2013/12/26 职场文书
我的小天地教学反思
2014/04/30 职场文书
体育专业求职信
2014/07/16 职场文书
群众路线教育实践活动民主生活会个人检查对照思想汇报
2014/10/04 职场文书
个人批评与自我批评
2014/10/15 职场文书
小学三八妇女节活动总结
2015/02/06 职场文书
学雷锋感言
2015/08/03 职场文书
Window server中安装Redis的超详细教程
2021/11/17 Redis
html中两种获取标签内的值的方法
2022/06/16 jQuery