宝哥软件园

简介AngularJS中使用工厂和服务的方法

编辑:宝哥软件园 来源:互联网 时间:2021-09-09

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

AngularJS提供例如许多内在的服务,如:$http,$路由,$窗口,$位置等。每个服务负责例如一个特定的任务,$http是用来创建创建交互式、快速动态网页应用的网页开发技术调用,以获得服务器的数据$路线。用来定义路由信息等。内置的服务总是前缀$符号。

有两种方法来创建服务。

工厂服务使用工厂方法

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

var主app=angular。模块(' main app ',[]);mainApp.factory('MathService ',function(){ var factory={ };factory.multiply=function(a,b){ return a * b } return factory;});使用服务方法

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

mainApp.service('CalcService ',function(math ServiCe){ this。square=函数(a){ return math ServiCe。乘法(a,a);}});例子

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

html头部标题角度JS表单/标题/头部主体H2角度JS示例应用程序/H2 div ng-app=' mainApp ' ng-controller=' calc controller ' pEnter a number :输入类型=' number ' ng-model=' number '/button ng-click=' square()' Xsup 2/sup/button preslt : { { result } }/p/div脚本src=' http :http://Ajax。谷歌api。com/Ajax/libmainapp . factory(' MathService ',function(){ var factory={ };factory.multiply=function(a,b){ return a * b } return factory;});mainApp.service('CalcService ',function(math ServiCe){ this。square=函数(a){ return math ServiCe。乘法(a,a);} });主应用程序。控制器(' calc controller ',函数($scope,calc service){ $ scope。square=function(){ $ scope。结果=计算服务。square($ scope)。数量);} });/脚本/正文/html结果

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

2015617105555351.jpg  (560429)

更多资讯
游戏推荐
更多+