长沙口碑最好网站建设公司排行榜,wordpress 摘要 图片,网站建设维护的相关基础知识,做网站收广告费原文地址#xff1a;http://www.cnblogs.com/lvdabao/p/3464015.html 今天学习了一下ng的service机制#xff0c;作为ng的基本知识之一#xff0c;有必要做一个了解#xff0c;在此做个笔记记录一下。 一、认识服务#xff08;service#xff09; 服务这个概念其实并不陌…原文地址http://www.cnblogs.com/lvdabao/p/3464015.html 今天学习了一下ng的service机制作为ng的基本知识之一有必要做一个了解在此做个笔记记录一下。 一、认识服务service 服务这个概念其实并不陌生在其他语言中如java便有这样的概念其作用就是对外提供某个特定的功能如消息服务文件压缩服务等是一个独立的模块。ng的服务是这样定义的 Angular services are singletons objects or functions that carry out specific tasks common to web apps. 它是一个单例对象或函数对外提供特定的功能。 首先是一个单例即无论这个服务被注入到任何地方对象始终只有一个实例。其次这与我们自己定义一个function然后在其他地方调用不同因为服务被定义在一个模块中所以其使用范围是可以被我们管理的。ng的避免全局变量污染意识非常强。 ng提供了很多内置的服务可以到API中查看http://docs.angularjs.org/api/。知道了概念我们来拉一个service出来溜溜看看到底是个什么用法。从这篇文章开始我就使用jsfiddle来写示例代码了再也不折腾博客园的变态编辑器了~ 我们在controller中直接声明$location服务这依靠ng的依赖注入机制。$location提供地址栏相关的服务我们在此只是简单的获取当前的地址。 服务的使用是如此简单我们可以把服务注入到controller、指令或者是其他服务中。 二、自定义服务 如同指令一样系统内置的服务以$开头我们也可以自己定义一个服务。定义服务的方式有如下几种 使用系统内置的$provide服务使用Module的factory方法使用Module的service方法 下面通过一个小例子来分别试验一下。我们定义一个名为remoteData服务它可以从远程获取数据这也是我们在程序中经常使用的功能。不过我这里没有远程服务器就写死一点数据模拟一下。 //使用$provide来定义
var app angular.module(MyApp, [], function($provide) {$provide.factory(remoteData, function() {var data {name:n,value:v};return data;});
}); //使用factory方法
app.factory(remoteData,function(){var data {name:n,value:v};return data;
}); //使用service方法
app.service(remoteData,function(){this.name n;this.value v;
}); Module的factory和$provide的factory方法是一模一样的从官网文档看它们其实就是一回事。至于Module内部是如何调用的我此处并不打算深究我只要知道怎么用就好了。 再看Module的service方法它没有return任何东西是因为service方法本身返回一个构造器系统会自动使用new关键字来创建出一个对象。所以我们看到在构造器函数内可以使用this这样调用该服务的地方便可以直接通过remoteData.name来访问数据了。 下面我们来用一下自己定义好的服务 三、管理服务的依赖关系 服务与服务中间可以有依赖关系例如我们这里定义一个名为validate的服务它的作用是验证数据是否合法它需要依赖我们从远程获取数据的服务remoteData。代码如下 在factory的参数中我们可以直接传入服务remoteDatang的依赖注入机制便帮我们做好了其他工作。不过一定要保证这个参数的名称与服务名称一致ng是根据名称来识别的。若参数的名次与服务名称不一致你就必须显示的声明一下方式如下 app.factory(validate,[remoteData,function(remoteDataService){return function(){if(remoteDataService.namen){alert(验证通过);}};
}]); 我们在controller中注入服务也是同样的道理使用的名称需要与服务名称一致才可以正确注入。否则你必须使用$inject来手动指定注入的服务。比如 function testC(scope,rd){scope.getData function(){alert(namerd.name valuerd.value);}
}
testC.$inject [$scope,remoteData]; ng服务的基本知识也就这些了。目前只是学些皮毛或许以后用到项目中了才能体会到他的强大之处以及在真实使用中的这样那样的问题。转载于:https://www.cnblogs.com/fcsh820/p/3464323.html
