1.AngularJS中,可以创建自己的服务,或使用内建服务;

2.在AngularJS中,服务是一个函数或对象,可在你的AngularJS应用中使用;

AngularJS内建了30多个服务;有个$location服务,它可以返回当前页面的URL;

var app=angular.module('myApp',[]);

app.controller('customersCtrl',function($scope,$location){

  $scope.myUrl=$location.absUrl();

});

3.$http是AngularJS应用中最常用的服务;服务向服务器发送请求,应用响应服务器传过来的数据;

AngularJS会一直监控应用,处理事件变化,AngularJS使用$location服务比使用window。location对象更好;

var app=angular('myApp',[]);

app.controller('myCtrl',function($scope,$http){

  $http.get("Welcome.htm").then(function(response){

    $scope.myWelcome=response.data;

  });

});

4.$timeout服务:响应了JS window.setTimeout函数:

var app=angular.module('myApp',[]);

app.controller('myCtrl',function($scope,$timeout){

  $scope.myHeader="Hello World!";

  $timeout(function(){

    $scope.myHeader="How are you today?";

  },2000);

});

5.$interval服务:对应了JS window.setInterval函数

var app=angular.module('myApp',[]);

app.controller('myCtrl',function($scope,$interval){

  $scope.theTime=new Date().toLocaleTimeString();

  $interval(function(){

    $scope.theTime=new Date().toLocaleTimeString();

  },1000);

});

6.创建自定义服务:可以创建访问自定义服务,链接到你的模块中;

app.service('hexafy',function(){

  this.myFunc=function(x){

    return x.toString(16);

  }

});

使用访问自定义服务,需要在定义过滤器的时候独立添加:

app.controller('myCtrl',function($scope,hexafy){

  $scope.hex=hexafy.myFunc(255);

});

7.过滤器中,使用自定义服务:当你创建了自定义服务,并连接到你的应用后,你可以在控制器,指令,过滤器或其他服务中使用它;

在过滤器myFormat中使用服务hexafy:

app.filter('myFormat',['hexafy',function(hexafy){

  return function(x){

    return hexafy.myFunc(x);

  };

}]);

Angular JS 学习之服务(Service)的更多相关文章

  1. Angular JS 中的服务注册方法

    在Angular JS中创建服务的几种方法 factory() service() constant() value() provider() factory(name,fn(){}) 该服务为单例的 ...

  2. 适合我胃口的angular.js学习资料

    断断续续弄了半年的ANGULAR.JS学习资料,网上下载了N多资料,测试了很多次. 现在只能算是入门,因时间问题,现在要转入其它领域. 如果以后要拾起来,下面这个PDF比较对我胃口. <Angu ...

  3. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  4. Angular.js学习笔记(三)

    一.过滤器 1.uppercase,lowercase 大小写转换{{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRI ...

  5. python , angular js 学习记录【2】

    1.不同scope之间的通信 (1)无父子关系的scope通信: 在需要操作的scope里面定义一个事件,名称为delete_host,参数为data $rootScope.$on('delete_h ...

  6. python , angular js 学习记录【1】

    1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...

  7. Angular JS 学习之路由

    1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...

  8. angular.js学习的第一天

    第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...

  9. Angular JS 学习之Bootstrap

    1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...

随机推荐

  1. Mathematics:Dead Fraction(POJ 1930)

    消失了的分式 题目大意:某个人在赶论文,需要把里面有些写成小数的数字化为分式,这些小数是无限循环小数(有理数),要你找对应的分母最小的那个分式(也就是从哪里开始循环并不知道). 一开始我也是蒙了,这尼 ...

  2. NHibernate实战详解(二)映射配置与应用

    关于NHibernate的资料本身就不多,中文的就更少了,好在有一些翻译文章含金量很高,另外NHibernate与Hibernate的使用方式可谓神似,所以也有不少经验可以去参考Hibernate. ...

  3. css 发光字效果

    <!DOCTYPE html> <html> <head> <!-- 超酷炫的CSS3发光字体,可自定义喔!!--> <meta http-equ ...

  4. 【leetcode】Reverse Linked List II (middle)

    Reverse a linked list from position m to n. Do it in-place and in one-pass. For example:Given 1-> ...

  5. 如何点击按钮后在加载外部的Js文件

    或许有朋友遇到过,想等自己点击按钮之后才执行某一个js文件,那么,你运气好,看到了我的代码了哈哈, <html> <head> <title></title& ...

  6. Hibernate单向一对多对象关系模型映射

    1 hibernate 的对象关系映射 Orm: 类-----表 属性------字段 对象------记录 表:在数据库中存在主外键的关系,反向工厂类是由表生成,在由表生成类的时候,类和类之间存在者 ...

  7. 在cmd窗口中运行php命令

    1.首先安装php.我使用的是wamp,里面包含php5.5.12 2.将C:\wamp\bin\php\php5.5.12添加到环境变量Path中 3.在cmd中运行php -v可以查看php版本相 ...

  8. gcc创建和使用静态库、动态库

    http://www.cnblogs.com/dyllove98/archive/2013/06/25/3155599.html 目录树结构: test/include/hello.h #ifdef ...

  9. 标准BT.656并行数据结构

    转自网络,感谢原作者和转载者. 还有参考:百科http://baike.baidu.com/link?url=bqBT3S7pz_mRJoQE7zkE0K-R1RgQ6FmHNOZ0EjhlSAN_o ...

  10. 与你相遇好幸运,Sails.js自定义responses

    在 /api/responses/ 新建文件 >serviceDBError.js 自定义的数据库错误 >serviceError.js  自定义的数据错误 >serviceSucc ...