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 相关文章推荐
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
Nov 14 Javascript
js png图片(有含有透明)在IE6中为什么不透明了
Feb 07 Javascript
Enter转换为Tab的小例子(兼容IE,Firefox)
Nov 14 Javascript
javascipt匹配单行和多行注释的正则表达式
Nov 20 Javascript
jQuery队列操作方法实例
Jun 11 Javascript
js点击button按钮跳转到另一个新页面
Oct 10 Javascript
JavaScript学习小结(一)——JavaScript入门基础
Sep 02 Javascript
老生常谈遮罩层 滚动条的问题
Apr 29 Javascript
JQuery判断正整数整理小结
Aug 21 jQuery
Cpage.js给组件绑定事件的实现代码
Aug 31 Javascript
小程序click-scroll组件设计
Jun 18 Javascript
typescript配置alias的详细步骤
Aug 12 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
PHP文件上传实例详解!!!
2007/01/02 PHP
php foreach 使用&amp;(与运算符)引用赋值要注意的问题
2010/02/16 PHP
PHP用GD库生成高质量的缩略图片
2011/03/09 PHP
C/S和B/S两种架构区别与优缺点分析
2014/10/23 PHP
JQuery在光标位置插入内容的实现代码
2010/06/18 Javascript
jquery+json实现数据列表分页示例代码
2013/11/15 Javascript
JavaScript中transform实现数字翻页效果
2017/03/08 Javascript
Mobile Web开发基础之四--处理手机设备的横竖屏问题
2017/08/11 Javascript
浏览器调试动态js脚本的方法(图解)
2018/01/19 Javascript
vue.js实现的绑定class操作示例
2018/07/06 Javascript
layer.open的自适应及居中及子页面标题的修改方法
2019/09/05 Javascript
解决layui table表单提示数据接口请求异常的问题
2019/09/24 Javascript
JavaScript enum枚举类型定义及使用方法
2020/05/15 Javascript
Python开发的单词频率统计工具wordsworth使用方法
2014/06/25 Python
Python爬虫实现网页信息抓取功能示例【URL与正则模块】
2017/05/18 Python
读取json格式为DataFrame(可转为.csv)的实例讲解
2018/06/05 Python
python实现Windows电脑定时关机
2018/06/20 Python
Python3.7实现中控考勤机自动连接
2018/08/28 Python
Tensorflow不支持AVX2指令集的解决方法
2020/02/03 Python
Django数据统计功能count()的使用
2020/11/30 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
CSS3的颜色渐变效果的示例代码
2017/09/29 HTML / CSS
欧洲最大的拼图游戏商店:JigsawPuzzle.co.uk
2018/07/04 全球购物
应届毕业生求职自荐书
2014/01/03 职场文书
微笑面对生活演讲稿
2014/09/23 职场文书
农村文化建设标语
2014/10/07 职场文书
行风评议整改报告
2014/11/06 职场文书
2015年中秋晚会主持稿
2015/07/30 职场文书
大学三好学生主要事迹范文
2015/11/03 职场文书
四年级作文之说明文作文
2019/10/14 职场文书
导游词之河北野三坡
2019/12/11 职场文书
Python中json.dumps()函数的使用解析
2021/05/17 Python
详解nginx location指令
2022/01/18 Servers
Python实现归一化算法详情
2022/03/18 Python
Anaconda安装pytorch和paddle的方法步骤
2022/04/03 Python
Win11如何默认打开软件界面最大化?Win11默认打开软件界面最大化的方法
2022/07/15 数码科技