angular JS 三种服务
来源:互联网 发布:生物医药上市知乎 编辑:程序博客网 时间:2024/06/03 09:18
1.Factory
2.Service
3.Provider
1.Factory
Factory创建的服务,就是返回一个有属性有方法的对象,相当于var f = myFactory();
//创建模型
var myModule = angular.module(‘myModule’,[]);
//通过工厂模式创建自定义服务
myModule.factory(‘factory’,function () {
var service = {};//定义一个object对象
service.name = ‘张三’;
//定义一个私有化属性
var age;
service.setAge = function (newAge) {
age = newAge;
}
service.getAge = function () {
return age;
}
return service;
})
//创建控制器
myModule.controller(‘myCtrl’,function ($scope,factory) {
factory.setAge(20);
$scope.a = factory.getAge;
alert(factory.name);
})
注:在Factory中不能注入$scope作用域对象
2.Service
通过Service方式创建自定义服务,相当于new一个对象:var s = new myService();只有把属性和方法添加到this上才可以在controller里调用。
//创建模型
var myModule = angular.module(‘myModule’,[]);
//创建service服务
myModule.service(‘myService’,function () {
this.name = ‘service’;
this.getData = function () {
alert(‘this is service function’);
}
})
myModule.controller(‘myCtrl’,function ($scope,myService) {
console.log(myService.name);
myService.getData();
})
3.Provider
只有Provider才是能传.config()函数的service,如果想在service对象启用之前,先进行模块范围配置,则应该使用Provider服务,需要注意的是,在.config()中注入Provider时,名字需要是providerName + Provider的形式,使用Provider的优点就是,你可以在provider对象传递到应用程序之前,可以在.config()中对provider对象进行修改。
当使用Provider创建服务时,唯一的可以在控制器中访问属性和方法是通过$get()函数返回内容。
//创建模型
var myModule = angular.module(‘myModule’,[]);
//在.config中给provider赋值
myModule.config(function (myproviderProvider) {
myproviderProvider.setName(‘providerName’);
})
//创建Provider服务
myModule.provider(‘myprovider’,function () {
var name = ”;
var test = {‘a’:’1’,’b’:’2’};
this.setName = function (newName) {
name = newName;
}
this.$get = function () {
return {
lastName: name,
test: test
}
}
})
myModule.controller(‘myCtrl’,function ($scope,myprovider) {
alert(myprovider.test.a);
})
4.在过滤器中注入自定义服务
//创建模型
var myModule = angular.module(‘myModule’,[]);
//创建Service服务
myModule.service(‘myService’,function () {
this.myFunc = function (x) {
return x.toString(16);
}
})
//过滤器
myModule.filter(‘myFilter’,[‘myService’,function (myService) {
return function (x) {
return myService.myFunc(x);
};
}]);
{{ 324113412412 | myFilter }}
- angular JS 三种服务
- angular js factory服务
- Angular.js(三)
- angular中定义服务的三种方式
- angular学习笔记--服务的三种定义方式
- angular的常用的三种服务 service,factory,provider
- Angular JS开发指南--(三)
- Angular.js学习笔记(三)
- angular五种服务详解
- angular五种服务详解
- Angular.js之服务与自定义服务学习笔记
- Angular中创建服务的三种方式factory、service、provider
- angular服务
- angular-服务
- Angular服务
- angular 服务
- angular服务
- Angular服务
- Java数据类型整理
- 人工智能微信讨论群
- css js bundle
- tomcat如何访问非webapp下的资源文件
- mysql 查看当前使用的配置文件my.cnf
- angular JS 三种服务
- OkHttp3-Android网络请求框架常用用法介绍与实例(mob请求天气预报),还好!
- java通过反射获取枚举对象
- 二级列表的实现
- googleservice学习
- 设计模式博客地址
- 关于调用微信上传素材接口返回41005错误的问题
- Docker实战-Docker Daemon
- web前后台数据交互的4种方式