angular中的自定义过滤器

<!DOCTYPE HTML>

<html ng-app="myApp">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="js/angular.min.js"></script>

</head>

<body>

<div ng-controller="Aaa">

<!-- {{name | firstUppercase}} -->

{{name}}

</div>

<div ng-controller="Bbb">

{{text | firstUppercase:4}}

</div>

<script>

var m1 = angular.module(‘myApp‘,[]);

//m1.run

//创建一个过滤器("过滤器的名字",回调函数)

m1.filter("firstUppercase",function(){

return function(data,number){

//原生js 字符串截取的操作

if(!number){

number = 1;

}

var str = data.substr(0,number).toUpperCase()+data.substr(number);

return str;

}

})

// $filter("firstUppercase")("要过滤的数据","过滤器接受的第一个参数","过滤器接受的第二个参数");

m1.controller(‘Aaa‘, [‘$scope‘,"$filter" ,function($scope,$filter){

$scope.name= "kerwin";

$scope.name= $filter("firstUppercase")($scope.name,1)

}])

m1.controller(‘Bbb‘, [‘$scope‘, function($scope){

$scope.text = "mytext";

}])

</script>

</body>

</html>

时间: 2025-01-13 03:20:09

angular中的自定义过滤器的相关文章

angular中的orderBy过滤器使用

一  orderBy过滤器 AngularJS中orderBy进行排序,第一个参数可以有三种类型,分别为:function,string,array: 第一种:function,如果是function,那么function函数会遍历待排序的数组,并将返回的结果作为angular库函数中comparator的参数,进行比较排序. 第二种:如果是字符串,假如待排序的数组为对象,那么将会按照待排序数组中的每个对象的对应属性值,进行排序.如果字符串前边加有“+”,“-”符号,那么+表示升序排序,-表示降

django模板中的自定义过滤器

(1)在APP下创建templatetags文件夹,与Models.py.views.py等同级,templatetags文件夹下添加__init__.py文件,可为空,再添加一个模块文件,例如cpt_filters.py,目录结构如下 myapp/ __init__.py models.py templatetags/ __init__.py cpt_filters.py views.py admin.py appa.py 目录下添加__init__.py文件可让python知道这里是pyth

angularJs的过滤器扩展及自定义过滤器

一.过滤器扩展 1.过滤器的组合使用 <!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="angular.min.js&

AngularJS中自定义过滤器

AngularJS中为我们提供了一些内置的过滤器,这里列举一些自定义过滤器的场景. 自定义过滤器,不带参赛 //过滤 不带参赛 app.filter('ordinal', function () { return function (number) { if (isNaN(number) || number < 1) { return number; } else { var lastDigit = number % 10; if (lastDigit === 1) { return numbe

Angular——自定义过滤器

基本介绍 除了使用AngularJS内建过滤器外,还可以根业务需要自定义过滤器,通过模块对象实例提供的filter方法自定义过滤器. 基本使用 (1)input是将绑定的数据以参数的形式传入 (2)input后面的参数也就是:后面的参数,指导在视图时候该如何传递参数 (3)filter方法的回调函数将函数作为返回值,最后这个函数会在视图中进行调用,并且返回值 App.filter('demo', function () { return function (input, arg) { retur

Django中自定义过滤器的使用

我在这里做的是: 从数据库查出id递增的一些信息,展示在前台. 编写一个过滤器判断查出数据的id是偶数的返回True 奇数返回False 1 创建项目,创建应用,注册应用,配置settings.py文件,配置urls映射,编写views试图,编写模板templates,编写models模块 切记 注册应用.  很多伙伴找不到自己定义的过滤器,是因为忘记注册应用! 2 创建过滤器的目录: 实际上,在项目目录或者应用目录下创建都是可以的,创建一个名为templatetags的python模块 在我这

angular中自定义依赖注入的方法和decorator修饰

自定义依赖注入的方法 1.factory('name',function () { return function(){ } }); 2.provider('name',function(){ this.$get=function(){ return function(){ } }; }); 3.service('name',function(){ this.n=v; }); 4.constant('name','value'); 5value('name','value'); 依赖的继承  

Angular中的内置指令和自定义指令

NG中的指令,到底是什么(what)? 为什么会有(why)?以及怎样使用(how)? What: 在NG中,指令扩展HTML功能,为 DOM 元素调用方法.定义行为绑定数据等. Why: 最大程度减少DOM操作,实现数据绑定,与业务逻辑进行交互. How: 指令主要分为两种:内置指令和自定义指令,通过下面的例子,简单记录一下如何去使用. 内置指令 在官方API文档上罗列了很多指令,内置指令可以分为:普通指令 和 事件指令,他们都是作用于HTML之上的,通过添加属性的方式来实现的.简单看一下一些

flask中自定义过滤器

第一种方法: 1,第一步:自定义过滤器函数 # 自定义一个函数,将list里面的数据进行排序 def list_sort(list) return list.sort() 2.第二步:注册过滤器 第一个参数是函数名,第二个参数是调用名 app.add_template_filter(list_sort, "sort1") 3,注册成功后就可以在模板中进行调用 <p>{{list | sort1}}</p> ============================