上一篇讲了自定义Directive，本篇是要讲到AngularJS的Filter。 Filter简介Filter是用来格式化数据用的。Filter的基本原型（ ‘|‘ 类似于Linux中的管道模式）：{{ expression | filter }}Filter可以被链式使用（即连续使用多个filter）：{{ expression | filter1 | filter2 | ... }}Filter也可以指定多个参数：{{ expression | filter:argument1:argument2:... }} AngularJS内建的FilterAngularJS内建了一些常用的Filter，我们一一...
本文主要介绍了AngularJS中下拉框的基本用法,结合具体实例形式分析了AngularJS下拉框的元素绑定、选中及显示等功能实现方法,需要的朋友可以参考下，希望能帮助到大家。HTML正文：<p ng-app="myApp" ng-controller="myCtrl"> <select ng-model="selectedName" ng-options="x for x in names"></select> 等价于： <select> <option ng-repeat="item in names">{{item}}</option> </select> <hr> <!-- ng-repeat绑定的值为一个字符串，...
在AngularJS中$interval用来处理间歇性处理一些事情。 最常用的是：var app = angular.module("app",[]); app.controller("AppCtrl", function($q. $interval){ var timer = $interval(function(){ },100); timer.then(success); function success(){ console.log("done"); } }) 以上，每隔100毫秒就做一件事，所有都昨晚在调用then函数。也就是，$interval提供回调函数。 是否可以控制做事的次数呢？--可以的。 var timer = $inte...
简介 为什么使用resolve： 当路由切换的时候，被路由的页面中的元素（标签）就会立马显示出来，同时，数据会被准备好并呈现出来。但是注意，数据和元素并不是同步的，在没有任何设置的情况下，AngularJS默认先呈现出元素，而后再呈现出数据。这样就会导致页面会被渲染两遍，导致“页面UI抖动”的问题，对用户不太友好。resolve的出现解决了这个问题。 resolve是干嘛用的： resolve属性里的值会在路由成功前被预先设定好，然后注入到...
ng-animate 本文讲一下Angular中动画应用的部分。 首先，Angular本生不提供动画机制，需要在项目中加入Angular插件模块ngAnimate才能完成Angular的动画机制，Angular也不提供具体的动画样式，所以说，它的自由度和可定制性挺大的。 那么，刚开始需要在项目的入口html文件中引入Angular框架(angular.js)，然后引入angular.animate.js。 在项目的js入口文件app.js中，新建项目模块，并且添加所依赖的模块ng-Animate(有其他需要的模块...
本文实例讲述了angular2中Http请求原理与用法。分享给大家供大家参考，具体如下： 提供HTTP服务 HttpModule并不是Angular的核心模块。 它是Angular用来进行Web访问的一种可选方式，并位于一个名叫@angular/http的独立附属模块中. 编辑app.module.ts import { HttpModule, JsonpModule } from @angular/http; @NgModule({imports: [HttpModule,JsonpModule], })angular-in-memory-web-api npm install angular-in-memory-web-api --...
项目筹备近期开启Angular学习，指令比较难理解所以记录备案，推荐视频大漠穷秋 Angular实战 由于篇幅过长,列举大纲如下：一、指令directive概述 指令可以对元素绑定事件监听或者改变DOM结构而使HTML拥有像jQuery一样效果具有交互性。不同于jQuery，Angular设计核心思想是通过数据与模板的绑定，摆脱繁琐的DOM操作，而将注意力集中在业务逻辑上。 几种常见指令ng-app 指令用来指定ng的作用域是在那个标签以内部分(<html ng-app="my...
前言 html中的属性很多，同样可以使用angularjs来定义： ng-attr-(suffix)=只能使用变量定义<div title="angularjs中的title">title</div> <div ng-attr-title="angularjs中的title">title</div><!--这样写显示不出来标题--> <div ng-attr-title="angularjs中的title">title</div><!--这样写显示不出来标题--> <div ng-attr-title="{{titleStr}}">title</div><!--只能使用变量定义--> angular.module(myApp,[]).controller(myCtrl,...
AngularJS extend用法 angular.extend:依次将第二个参数及后续的参数的第一层属性（不管是简单属性还是对象）拷贝赋给第一个参数的第一层属性，即如果是对象，则是引用的是同一个对象，并返回第一个参数对象。 实例一：var r = angular.extend(b, a);将对象a的第一层属性（不管是简单属性还是对象）拷贝赋给对象b的第一层属性，即如果是对象，则是引用的是同一个对象，并返回对象bJs代码 var a = { name : bijian, addr...
本文实例讲述了AngularJS模板加载用法。分享给大家供大家参考，具体如下： angular模板加载 ----ng-template AngularJS作为mvc（或者说mvvm)框架，同样具备模板这一基本概念。 NG加载模板的顺序为 内存加载---AJAX加载。 内存加载 如果之前使用过Bootstrap 插件的ng版，即angular-ui，就会了解到这种方式的具体应用。模板本质上是字符串，把字符串直接写入内存，加载时直接从内存获取，速度会更快，有两种方式显式启用内存加载。 通...
本文实例讲述了AngularJS指令用法。分享给大家供大家参考，具体如下： 指令（directives）是任何AngularJS应用中最重要的成分。尽管AngularJS已经自带了很多指令，你经常会发现需要自己亲手创建一些特别的指令。本文将会带你了解自定义指令并解释如何在现实世界中的Angular项目中使用它们。文章的最后，我们将一起用Angular指令来创建一个简单的笔记小应用。 综述 一个指令就是一个引入新语法的东西。指令是在DOM元素上做的标记，并...
本文实例讲述了AngularJS中transclude用法。分享给大家供大家参考，具体如下： Transclude - 在Angular的指令中，大家会看到有一个这样的一个配置属性，这个单词在英文字典里面也查询不到真实的意思，所以就用英文来标示它吧。如果你深入的使用angular的话，你就花很大一部分时间来创建自定义指令，那么就不可避免的要深入理解transclude。简单的讲，transclude主要完成以下工作，取出自定义指令中的内容(就是写在指令里面的子元素...
最近在angular中使用select指令时，出现了很多问题，搞得很郁闷。查看了很多资料后，发现select指令并不简单，决定总结一下。select用法： <select ng-model="" [name=""] [required=""] [ng-required=""] [ng-options=""]> </select> 属性说明：发现并没有ng-change属性ng-required：当属性值为true时，对select添加required验证，为false时不验证。ng-options：指定数据源，生成option选项。数据源为数组时,用法：label for v...
在AngularJS中$interval用来处理间歇性处理一些事情。 最常用的是： var app = angular.module("app",[]); app.controller("AppCtrl", function($q. $interval){ var timer = $interval(function(){ },100); timer.then(success); function success(){ console.log("done"); } }) 以上，每隔100毫秒就做一件事，所有都昨晚在调用then函数。也就是，$interval提供回调函数。 是否可以控制做事的次数呢？ --可以的。 var timer = $in...