1. 第一种方法(也是最简单的)
参数一:“服务名称”
参数二:服务的具体实践
局限性:在这个服务当中,不能使用其它的服务
// value服务可以传一个死值
app.value("pi",3.1415926)
// 将json形式的数据转化成key = value形式
app.value("urlEncoded",function(json){
var temp = []
for(key in json){
// 获取指定的value
var value= json[key]
var newValue = key + "=" + value
temp.push(newValue)
}
// 将数组中的所有元素放入一个字符串中,并以&连接
var result = temp.join("&")
retrun result
})
2. 第二种方式
参数一:自定义服务的名称
参数二:具体实现,里面可以添加依赖的其它服务
factory 要求必须返回一个对象,对象是什么类型的没有明确要求
app.factory("myFactory",function(pi){
// 将3.1415926向取整
var value = Math.floor(pi)
// 求取整后的平方
var result = Math.pow(value,2)
return result
})
第三种方法
参数一:自定义服务的名字
参数二:具体实现,还可以添加依赖的服务
每一个通过service创建的对象,都是new出来的对象,类似于构造函数
app.server("myService",function(pi,myFactory){
this.pi = pi
this.factory = myFactory
this.name = "张三"
})
第四种方法(相对于前三种来说,比较复杂,如果你已经学过Vue,那么理解起来就比较容易)
参数一:指定一函数服务的名称
参数二:工厂函数实现
通过provider定义的服务,只能在这个内部是用
$get自定义服务的具体实现(固定格式)
app.provider("randomStr",function(){
// 这里相当于vue组件内的返回值,一定要有一个return,数据写在return内,
要想找到return内的数据,要通过this找到
return{
length:5
// 对length进行设置
setLength: function(len){
this.length = len
}
// $get内生成一个多位随即数,随机位数和return内的length一致
$get: function(){
var str= "QWERTYUIOPASDFGHJKLZXCVBNM"
for(var index = 0; index < this.length; index++){
var random = Math.floor(Math.random() * str.length)
var char = str[random]
value += char
}
return value
}
}
})
// 对randomStr服务进行设置
// provider的配置选项,该选项会在自定义provider加载的术后自动调用
// randomStrProvider 为固定格式,对自定义服务进行配置时,后面都要带上Provider
app.config(function(randomStrProvider){
// 调用ramdomStr内部的方法并调用
randomStrProvider.setLength(10)
})
// 最后在Angular内添加服务依赖
app.controller("ctrl1",function($scope,pi,urlEncoded,myFactory,myService,randomStr){
console.log(pi)
console.log(urlEncoded({name:"张三",age:18}))
console.log(myFactory)
console.log(myService.name)
// 将myService依赖内的name值赋值给controller控制器内的des
$scope.des = myService.name
console.log(randomStr)
})