前面的文章介绍了很多angular自带的指令，下面我们看看如何使用directive自定义指令。 先看一个例子： <body><div my-hello></div> </body> <script type="text/javascript"> var m1 = angular.module(myApp,[]); m1.directive(myHello,function(){return {restrict : A,replace : true,template : <div>hello angular</div>}; }); </script> 1：我们定义了一个my-hello的指令。 2：使用directive完善这个指令，返回一个对象。有三...
在实际的开发过程中，很多後端返回给我们的数据都是需要格式化处理的，在angular中为我们内置提供了filter指令，可以很方便的对数据进行处理。首先我们看看在视图中是如何使用过滤器的。 1、currency(货币)格式化 <div ng-controller="Aaa"><p>{{name | currency:￥}}</p> </div> <script type="text/javascript">var m1 = angular.module(myApp,[]);m1.controller(Aaa,[$scope,function($scope){$scope.name = 12334.273489274834...
本文实例讲述了AngularJS自定义控件。分享给大家供大家参考，具体如下： 自定义指令介绍 AngularJS 指令作用是在 AngulaJS 应用中操作 Html 渲染。比如说，内插指令 ( {{ }} ), ng-repeat 指令以及 ng-if 指令。 当然你也可以实现自己的。这就是 AngularJS 所谓的"教会 HTML 玩新姿势”。本文将告诉你如何做到。 指令类型 可以自定义的指令类型如下: 元素 属性 CSS class Comment directives 这里面，AngularJS 强烈建议你用元素和...
本文实例讲述了AngularJS自定义插件实现网站用户引导功能。分享给大家供大家参考，具体如下： 最近由于项目进行了较大的改版，为了让用户能够适应这次新的改版，因此在系统中引入了“用户引导”功能，对于初次进入系统的用户一些简单的使用培训training。对于大多数网站来说，这是一个很常见的功能。所以在开发这个任务之前，博主尝试将其抽象化，独立于现有系统的业务逻辑，将其封装为一个通用的插件，使得代码更容易扩展和维护。...
html代码 <form name="form"><input type="password" name="password" ng-model="password" required placeholder="请输入密码"><input type="password" name="passwordConfirm" ng-model="passwordConfirm" equal-to="password" placeholder="请再次输入密码"><span ng-show="form.passwordConfirm.$error.equalTo">两次密码不一致</span></form>js angular.module("Valid",[]).directive("equalTo", function () {return {requir...
本文主要给大家介绍如何判断验证器的结果。在这里，我们就来看看怎样实现一个自定义的验证器。 目标 我们要实现一个验证手机号的验证器，使用的实例还是基于之前的文章里面的实例，也就是用户信息输入的表单页面。我们在手机号的元素上添加一个验证手机号的验证器。然后，如果手机号验证失败，就显示一个错误，页面如下：这部分教程的代码可以从github获取: git clone https://github.com/Mavlarn/angular2-forms-tutorial 如果要运...
前言 众所周知AngularJS 中可以使用 ng-repeat 显示列表数据，这对大家来说应该都不陌生了， 用起来很简单， 也很方便， 比如要显示一个产品表格， Controller 的 Javascript 代码如下： angular.module(app, []) .controller(MyController, MyController);MyController.$inject = [$scope]; function MyController($scope) {// 要显示的产品列表数据；$scope.products = [{id: 1,name: Product 1,description: Product 1 descript...
前言 相信大家都知道过滤器的使用：一种是在html中的使用，一种是在js代码中的使用，下面我们来通过实例深入了解。 实例代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>过滤器</title> <script src="day2/src/angular.js"></script> <style type="text/css"> </style> </head> <body> <div ng-app="fristApp"> <div ng-controller="fristController"> <!--多个过滤器之间用 | 链接--> <!--参数的实质就是把参...
AngularJS另一个特点就是提供了过滤器，可以通过操作UNIX下管道的方式，操作数据结果。通过使用管道，可以便于双向的数据绑定中视图的展现。过滤器在处理过程中，将数据变成新的格式，而且可以使用管道这种链式风格，还能接受附加的参数。实现方式下面看一下如何定义声明一个过滤器，首先依然是要创建我们自己的模块myAppModule var myAppModule=agular.module("myApp",[]);接下来在模块的基础上，创建过滤器：...
前言 大家都知道对于处理小数量，ng-repeat是非常有用的，但是如果需要处理非常大的数量集，还是采用自定义的方法更好一些。特别是数据大多都是静态的或已预存储好的，这个时候应避免使用ng-repeat指令。 ng-repeat中的表达式和 $watch Angular中的表达式都会创建$watch 的Scope 函数。用于监听模型变化，当你的模型部分发生变化时它会通知你。在ng-repeat指令中，如果某行数据有15列数据都绑定了表达式，如果数据有1000多行的话，...
AngularJS支持用户自定义标签属性，在不需要使用DOM节点操作的情况下，添加自定义的内容。 前面提到AngularJS的四大特性：1 MVC2 模块化3 指令4 双向数据绑定 下面将会介绍如下的内容：1 如何自定义指令2 自定义指令的使用3 自定义指令的内嵌使用如何自定义指令：Angular是基于模块的框架，因此上来肯定要创建一个自己的模块： var myAppModule = angular.module("myApp",[]);然后在此模块基础上创建指令directive myAppModul...
自定义指令中使用AngularJS扩展HTML的功能。自定义指令使用的“指令”的功能定义。自定义指令只是替换了它被激活的元素。引导过程中AngularJS应用程序找到了匹配的元素，并做好使用自定义指令compile()方法一次活动再处理使用基于指令的范围自定义指令link()方法的元素。 AngularJS提供支持，以下列元素的类型来创建自定义指令。 Element directives - 指令遇到时激活一个匹配的元素。 Attribute - - 指令遇到时激活一个匹配的属性...
本文实例讲述了Angularjs使用directive自定义指令实现attribute继承的方法。分享给大家供大家参考，具体如下： 一、Html代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><script src="../../Content/Plugins/Angular/angular.min.js"></script> </head> <body ng-app="mainApp" ng-controller="mainController">...
写在前面： AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。angularJS是google公司主推的js开发优秀框架...页面展示：在应用中进行加密是普遍存在的，个人建议在前端实现加密签名（前端加密是否必要来自知乎：http://www.zhihu.com/question/25539382）对base64、md5、sha1加密算法简单解释：1、base64是可逆的、对称的加密算法；b...
AngularJS简介：AngularJS 通过新的属性和表达式扩展了 HTML。AngularJS 可以构建一个单一页面应用程序（SPAs：Single Page Applications）。AngularJS 学习起来非常简单。 angularjs 中可通过三种（$provider,$factory,$service）方式自定义服务，以下是不同的实现形式：// 定义module , module中注入$provide var starterApp = angular.module(starter.controllers, [],function($provide){ // 第一种方式：使用provide的provide...