AngularJS 基础4

过滤器(Filter):过滤器的主要用途就是一个格式化数据的小工具,一般用于服务端存储的数据转换为用户界面可以理解的数据
常见需要使用Filter的数据有:时间 1288323623006
date 过滤器:
主要用于时间格式的转换:

<span>{{'1288323623006' | date:"MM/dd/yyyy 'at' h:mma"}}</span>

limitto 过滤器:
limitto过滤器用于限制一个字符串或数组展示的长度:

<ul class="messages">
    <li ng-repeat="item in messages | limitTo:-2">
        {{item.content | limitTo:2 }}
    </li>
</ul>

filter 过滤器:filter过滤器会根据设置的检索数据过滤未匹配到的数据内容也可以通过设置检索条件为一个对象,实现在指定属性中检索

<ul class="messages">
    <li ng-repeat="item in messages | filter:{content:123}">
        {{item.content}}
    </li>
</ul>

filter 过滤器 – 自定义比较:
通过自定义一个比较函数,在前台为filter指定第二个参数实现:

<ul class="numbers">
    <li ng-repeat="item in numbers | filter:1:comparator">
        {{ item }}
    </li>
</ul>
// js代码
$scope.comparator = function (source,target) {
    return source > target;
};

json 过滤器:可以将一个对象以json形式解析利用它我们可以在界面上直观的查看一些对象的成员,是调试的好办法
自定义过滤器:自定义过滤器实现自定义数据格式转换

angular.module('MyAppFilters', []).filter('checkmark', function() {
    return function(input) {
        return input ? '\u2713' : '\u2718';
    };
});

Form 表单:form表单元素在AngularJS中也是一个指令,具备表单解析、格式化、校验等功能,依赖于H5的智能表单
Form 表单 – 验证:AngularJS允许在表单中使用H5的一些校验属性,同时会根据校验条件的规则作出相应的数据变化
注意:在使用验证时先取消浏览器本身自带的验证(给表单添加novalidate属性)
Form 表单 – 验证规则:必填项 required or ng-required
最小长度 minlength or ng-minlength
最大长度 maxlength
类型 type(number、email)
等等

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
该资源内项目源码是个人的课程设计、毕业设计,代码都测试ok,都是运行成功后才上传资源,答辩评审平均分达到96分,放心下载使用! ## 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。 该资源内项目源码是个人的课程设计,代码都测试ok,都是运行成功后才上传资源,答辩评审平均分达到96分,放心下载使用! ## 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值