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继承的实现代码
Aug 05 Javascript
关于jquery性能最佳实践的讨论,与求教
Mar 30 Javascript
jQuery的:parent选择器定义和用法
Jul 01 Javascript
jQuery中:last-child选择器用法实例
Dec 31 Javascript
需要牢记的JavaScript基础知识
Sep 25 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
Oct 31 Javascript
微信小程序签到功能
Oct 31 Javascript
Vant的安装和配合引入Vue.js项目里的方法步骤
Dec 05 Javascript
微信小程序实现图片压缩
Dec 03 Javascript
vue el-upload上传文件的示例代码
Dec 21 Vue.js
Vue看了就会的8个小技巧
Jan 21 Vue.js
vue中data里面的数据相互使用方式
Jun 05 Vue.js
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不写闭合标签的好处
2014/03/04 PHP
PHP记录和读取JSON格式日志文件
2016/07/07 PHP
php intval函数用法总结
2019/04/14 PHP
Json序列化和反序列化方法解析
2013/12/19 Javascript
KnockoutJS 3.X API 第四章之表单textInput、hasFocus、checked绑定
2016/10/11 Javascript
微信小程序 摇一摇抽奖简单实例实现代码
2017/01/09 Javascript
jQuery实现遍历复选框的方法示例
2017/03/06 Javascript
jQuery判断邮箱格式对错实例代码讲解
2017/04/12 jQuery
React Native悬浮按钮组件的示例代码
2018/04/05 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
2018/09/04 Javascript
layui监听下拉选框选中值变化的方法(包含监听普通下拉选框)
2019/09/24 Javascript
AntV F2和vue-cli构建移动端可视化视图过程详解
2019/10/08 Javascript
javascript将扁平的数据转为树形结构的高效率算法
2020/02/27 Javascript
[02:02]DOTA2英雄基础教程 斯拉达
2013/12/11 DOTA
[01:45]亚洲邀请赛互动指南虚拟物品介绍
2015/01/30 DOTA
python基于mysql实现的简单队列以及跨进程锁实例详解
2014/07/07 Python
在Django中创建动态视图的教程
2015/07/15 Python
python连接数据库的方法
2017/10/19 Python
Python与R语言的简要对比
2017/11/14 Python
tornado 多进程模式解析
2018/01/15 Python
Python实现文件信息进行合并实例代码
2018/01/17 Python
将Django项目部署到CentOs服务器中
2018/10/18 Python
对Python中的条件判断、循环以及循环的终止方法详解
2019/02/08 Python
Python实现快速排序的方法详解
2019/10/25 Python
Pycharm打开已有项目配置python环境的方法
2020/07/03 Python
css3 transform导致子元素固定定位变成绝对定位的方法
2020/03/06 HTML / CSS
什么是servlet链?
2014/07/13 面试题
优秀大学生求职自荐信范文
2014/04/19 职场文书
安全宣传标语
2014/06/10 职场文书
机械机修工岗位职责
2014/08/03 职场文书
党员干部群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
县委党的群众路线教育实践活动工作情况报告
2014/10/25 职场文书
党的群众路线教育实践活动个人对照检查材料(乡镇)
2014/11/05 职场文书
写自招自荐信的绝招!
2019/04/19 职场文书
【2·13】一图读懂中国无线电发展
2022/02/18 无线电
MySQL中TIMESTAMP类型返回日期时间数据中带有T的解决
2022/12/24 MySQL