随笔分类 -  AngularJS

摘要:通常,在AngularJS中使用JSON作为存储数据的模型。我们可能这样在controller中写model: app.controller('BookController',['$scope',function($scope){ $scope.book = { id:1, name:'', aut 阅读全文
posted @ 2016-02-16 15:18 Darren Ji 阅读(1160) 评论(0) 推荐(0) 编辑
摘要:本篇体验使用AngularJS自定义一个记录日志的服务。 在AngularJS中,服务的一些写法是这样的: var app = angular.module('app',[]); app.provider('providerName', function(){...}); app.service(' 阅读全文
posted @ 2016-02-16 14:19 Darren Ji 阅读(1531) 评论(0) 推荐(0) 编辑
摘要:$http服务允许我们与服务端交互,有时候我们希望在发出请求之前以及收到响应之后做些事情。即http拦截。$httpProvider包含了一个interceptors的数组。我们这样创建一个interceptor。 app.factory('myInterceptor', ['$log', func 阅读全文
posted @ 2016-02-08 20:36 Darren Ji 阅读(4862) 评论(0) 推荐(1) 编辑
摘要:promise是Javascript异步编程很好的解决方案。对于一个异步方法,执行一个回调函数。比如页面调用google地图的api时就使用到了promise。 function success(position){ var cords = position.coords; console.log( 阅读全文
posted @ 2016-02-07 15:57 Darren Ji 阅读(646) 评论(0) 推荐(0) 编辑
摘要:在AngularJS的实际项目中,经常需要处理多个$http请求,每个$http请求返回一个promise,我们可以把多个promise放到$q.all()方法接受的一个数组实参中去。■ 处理多个$http请求 angular.module('app',[]) .controller('AppCtr 阅读全文
posted @ 2016-02-06 13:05 Darren Ji 阅读(2779) 评论(0) 推荐(0) 编辑
摘要:AngularJS中有一个filterFilter函数用来对集合过滤,非常方便。源代码大致如下: function filterFilter(){ return function(aray, expression comparator){ if(!isArray(array)) return arr 阅读全文
posted @ 2016-02-05 12:30 Darren Ji 阅读(1837) 评论(0) 推荐(0) 编辑
摘要:在AngularJS中,ng-controller是最常用的directive。比如: var app = angular.module("app",[]); app.controlle("AppCtrl", function(){ var app = this; app.people = [ {" 阅读全文
posted @ 2016-02-05 11:13 Darren Ji 阅读(2540) 评论(0) 推荐(0) 编辑
摘要:本篇体验使用AngularJS向后端ASP.NET API控制器上传文件。 首先服务端: public class FilesController : ApiController { //using System.Web.Http [HttpPost] public async Task<HttpR 阅读全文
posted @ 2016-02-03 13:16 Darren Ji 阅读(2112) 评论(0) 推荐(0) 编辑
摘要:如何在页面呈现一段html代码段呢?在textarea中我们这样写:<textarea name="" id="" cols="30" rows="" ng-model="app.someHtml"></textarea>也可以这样写:<div ng-bind-html="app.someHtml" 阅读全文
posted @ 2016-02-03 09:56 Darren Ji 阅读(1861) 评论(0) 推荐(0) 编辑
摘要:有这样的一个场景,这里有一个表单:<form role="form"> ...</form>我们希望在form的外层动态包裹上一层。有可能是这样:<div id="well"> <form role="form"> ... </form></div>也有可能是这样:<div id="red"> <f 阅读全文
posted @ 2016-02-03 09:32 Darren Ji 阅读(799) 评论(0) 推荐(0) 编辑
摘要:在AngularJS中如何实现一个Model的缓存呢?可以通过在Provider中返回一个构造函数,并在构造函数中设计一个缓存字段,在本篇末尾将引出这种做法。一般来说,Model要赋值给Scope的某个变量。有的直接把对象赋值给Scope变量;有的在Provider中返回一个对象再赋值给Scope变 阅读全文
posted @ 2016-02-02 22:22 Darren Ji 阅读(844) 评论(1) 推荐(0) 编辑
摘要:如何在控制台获取到某个元素的Scope呢?假设,页面元素为:<label>Name:</label><input type="text" ng-model="yourName" placeholder="Enter a name here"><h1>{{yourName}}</h1>→ 选择inpu 阅读全文
posted @ 2016-02-02 20:34 Darren Ji 阅读(1446) 评论(0) 推荐(0) 编辑
摘要:本篇通过jQuery和Angular两种方式来实现同一个实例,从而体验两者的不同点以及AngularJS的迷人之处。首先当然需要引用jquery.js和angular.js文件。■ 使用jQuery让写一个简单的click事件 <button id="jquery-button">JQuery Bu 阅读全文
posted @ 2016-02-02 06:55 Darren Ji 阅读(576) 评论(0) 推荐(0) 编辑
摘要:在AngularJS中$interval用来处理间歇性处理一些事情。最常用的是: var app = angular.module("app",[]); app.controller("AppCtrl", function($q. $interval){ var timer = $interval( 阅读全文
posted @ 2016-02-02 06:26 Darren Ji 阅读(6265) 评论(0) 推荐(0) 编辑
摘要:在使用AngularJS中处理promise的时候,有时会碰到需要处理多个promise的情况。最简单的处理就是每个promise都then。如下: var app = angular.module("app",[]); app.controller("AppCtrl", function($q. 阅读全文
posted @ 2016-02-02 06:07 Darren Ji 阅读(700) 评论(0) 推荐(0) 编辑
摘要:在AngularJS中,可以从$rootScope中获取数据源,也可以把获取数据的逻辑封装在service中,然后注入到app.run函数中,或者注入到controller中。本篇就来整理获取数据的几种方式。■ 数据源放在$rootScope中 var app = angular.module("a 阅读全文
posted @ 2016-02-02 05:49 Darren Ji 阅读(2917) 评论(0) 推荐(0) 编辑
摘要:首先是angular-ui-router的基本用法。■ 如何引用依赖angular-ui-router angular.module('app',["ui.router"]) .config(function($stateProvider){ $stateProvider.state(stateNa 阅读全文
posted @ 2016-01-29 09:14 Darren Ji 阅读(8969) 评论(4) 推荐(3) 编辑
摘要:假设有这样的一个场景:我们知道一个用户某次航班,抽象成一个departure,大致是:{userID : user.email,flightID : "UA_343223",date: "01/14/2014 8:00 AM"}有关航班的,抽象成一个flight,大致是:{id: flightID, 阅读全文
posted @ 2016-01-27 14:44 Darren Ji 阅读(1060) 评论(0) 推荐(0) 编辑
摘要:在"AngularJS中转换响应内容"中,体验了如何转换响应内容。本篇来体验如何转换请求内容。主页面通过onSend方法把request对象转递出去。 发送request对象和onSend方法被定义在了controller中。angular.module('api.controller... 阅读全文
posted @ 2016-01-27 11:31 Darren Ji 阅读(2722) 评论(0) 推荐(0) 编辑
摘要:从远程API获取到的响应内容,通常是json格式的,有时候需要对获取到的内容进行转换,比如去除某些不需要的字段,给字段取别名,等等。本篇就来体验在AngualrJS中如何实现。在主页面,还是从controller中拿数据。 ... 阅读全文
posted @ 2016-01-27 11:03 Darren Ji 阅读(1839) 评论(0) 推荐(0) 编辑

我的公众号:新语新世界,欢迎关注。