AngularJS支持使用服务的体系结构“关注点分离”的概念。服务是JavaScript函数，并负责只做一个特定的任务。这也使得他们即维护和测试的单独实体。控制器，过滤器可以调用它们作为需求的基础。服务使用AngularJS的依赖注入机制注入正常。

AngularJS提供例如许多内在的服务，如：$http, $route, $window, $location等。每个服务负责例如一个特定的任务，$http是用来创建AJAX调用，以获得服务器的数据。 $route用来定义路由信息等。内置的服务总是前缀$符号。

有两种方法来创建服务。

  1. 工厂
  2. 服务

使用工厂方法

使用工厂方法，我们先定义一个工厂，然后分配方法给它。

   var mainApp = angular.module("mainApp", []);

   mainApp.factory('MathService', function() {

     var factory = {};

     factory.multiply = function(a, b) {

      return a * b

     }

     return factory;

   });

使用服务方法

使用服务的方法，我们定义了一个服务，然后分配方法。还注入已经可用的服务。

mainApp.service('CalcService', function(MathService){

  this.square = function(a) {

 return MathService.multiply(a,a);

 }

});

例子

下面的例子将展示上述所有指令。
testAngularJS.html

<html>

<head>

  <title>Angular JS Forms</title>

</head>

<body>

  <h2>AngularJS Sample Application</h2>

  <div ng-app="mainApp" ng-controller="CalcController">

   <p>Enter a number: <input type="number" ng-model="number" />

   <button ng-click="square()">X<sup>2</sup></button>

   <p>Result: {{result}}</p>

  </div>

  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>

  <script>

   var mainApp = angular.module("mainApp", []);

   mainApp.factory('MathService', function() {

     var factory = {};

     factory.multiply = function(a, b) {

      return a * b

     }

     return factory;

   }); 

   mainApp.service('CalcService', function(MathService){

      this.square = function(a) {

      return MathService.multiply(a,a);

     }

   });

   mainApp.controller('CalcController', function($scope, CalcService) {

      $scope.square = function() {

      $scope.result = CalcService.square($scope.number);

     }

   });

  </script>

</body>

</html>

结果

在Web浏览器打开textAngularJS.html。看到结果如下。

简介AngularJS中使用factory和service的方法的更多相关文章

  1. AngularJS进阶(三十三)书海拾贝之简介AngularJS中使用factory和service的方法

    简介AngularJS中使用factory和service的方法 AngularJS支持使用服务的体系结构"关注点分离"的概念.服务是JavaScript函数,并负责只做一个特定的 ...

  2. AngularJS 中的 factory、 service 和 provider区别，简单易懂

    转自:http://blog.csdn.net/ywl570717586/article/details/51306176 初学 AngularJS 时, 肯定会对其提供 factory . serv ...

  3. 简介Python中用于处理字符串的center()方法

    简介Python中用于处理字符串的center()方法 这篇文章主要介绍了简介Python中用于处理字符串的center()方法,是Python入门中的基础知识,需要的朋友可以参考下 center() ...

  4. 【AngularJS中的自定义服务service VS factory VS provider】---它们的区别，你知道么？

    在介绍AngularJS自定义服务之前,我们先来了解一下AngularJS~ 学过HTML的人都知道,HTML是一门很好的伪静态文本展示设计的声明式语言,但是,要构建WEB应用的话它就显得乏力了. 而 ...

  5. angularjs中factory, service和provider

    在Angular里面,services作为单例对象在需要到的时候被创建,只有在应用生命周期结束的时候(关闭浏览器)才会被清除.而controllers在不需要的时候就会被销毁了(因为service的底 ...

  6. angularjs中provider，factory，service的区别和用法

    angularjs中provider,factory,service的区别和用法 都能提供service,但是又有差别 service 第一次被注入时实例化,只实例化一次,整个应用的生命周期中是个单例 ...

  7. AngularJS中的Provider们：Service和Factory等的区别

    引言 看了很多文章可能还是不太说得出AngularJS中的几个创建供应商(provider)的方法(factory(),service(),provider())到底有啥区别,啥时候该用啥,之前一直傻 ...

  8. [译]AngularJS中几种Providers(Factory, Service, Provider)的区别

    原文: http://blog.xebia.com/2013/09/01/differences-between-providers-in-angularjs/ 什么是Provider? Angula ...

  9. angularjs 中 Factory,Service,Provider 之间的区别

    本片文章是使用了 angularjs 中使用 service 在controller 之间 share 对象和数据 的code(http://jsfiddle.net/kn46u0uj/1/) 来进行 ...

随机推荐

  1. HDU 1251 Trie树模板题

    1.HDU 1251 统计难题  Trie树模板题,或者map 2.总结:用C++过了,G++就爆内存.. 题意:查找给定前缀的单词数量. #include<iostream> #incl ...

  2. 七、考反映小游戏《苹果iOS实例编程入门教程》

    该app为应用的功能为一个简单的考反应游戏 纲要:-UIButton, UILabel, UIImageView 的运用:-利用rendom增加游戏可玩性: 游戏说明: 在按下开始游戏后,分为三盏的指 ...

  3. Node.js 手册查询-1-核心模块方法

    Node.js 学习手册 标签(空格分隔): node.js 模块 核心模块 核心模块是被编译成二进制代码,引用的时候只需require表示符即可 os 系统基本信息 os模块可提供操作系统的一些基本 ...

  4. linux shell 获取进程pid

    1.通过可执行程序的程序名称 a.运行程序 b.获取进程id号 c.pidof相关知识:http://www.cnblogs.com/yunsicai/p/3675938.html 2.有些程序需要在 ...

  5. LeetCode(43. Multiply Strings)

    题目: Given two numbers represented as strings, return multiplication of the numbers as a string. Note ...

  6. css重新认识(2)

    1)行内元素可以用margin-left与margin-right调整位置,但用margin-top与margin-bottom来调整位置不会有效果,只有具有block属性值后才能像块级元素般被外边距 ...

  7. Daily Scrum 10.27

    今天是星期天,但大家都没有放松,还是抽出了一定的时间来完成任务.可以感觉出来在编译作业的压力下大家的热情不是很高涨,希望大家坚持下去. 下面是今天的Task统计: 下面是所有迭代的状态:

  8. C# @符号的作用， 可定义关键字为变量名

    一 字符串中的用法字符@表示,其后的字符串是个“逐字字符串”(verbatim string).@只能对字符串常量作用.1.用于文件路径以下是引用片段:string s_FilePath =" ...

  9. bootstrap input框清空

    <!DOCTYPE HTML> <html> <head> <link href="http://netdna.bootstrapcdn.com/t ...

  10. 温故而知新，jquery选择器$=

    $("select[name$=Sort]") 可以选择到如下元素: <select class="sort-selec" name="eton ...