出于内存占用和性能的考虑,控制器只会在需要时被实例化,并且不再需要就会被销毁。这意味着每次切换路由或者重新加载视图时,控制器只会在需要时被实例化,并且不再需要就会被销毁。这意味着每次切换路由或重新加载视图时,当前的控制器会被AngularJS清除掉。
服务提供了一种能够在应用的整个生命周期内保持数据的方法,它能够在控制器之间进行通信,并且能保证数据的一致性。
AngularJS中可以创建自己的服务,也可以使用内置的服务。
AngularJS的五种创建模式:value、constant、factory、service、provider。
value()
- 变量
此方法接收两个参数: - name(字符串):需要注册的服务名
- value(值):将这个值作为可注入的实例返回
constant()
- 常量
可以将一个已经存在的变量值注册为服务,并将其注入到应用的其他部分当中。例如,假设我们需要给后端服务一个apiKey,可以用constant()将其当做常量保存下来。
此方法接收两个参数: - name(字符串):需要注册的服务名
- value(值):将这个值作为可注入的实例返回
constant()的值不可被改变
factory()
- 最常用
接收两个参数: - name(字符串):需要注册的服务名。
- getFn(函数):会在AngularJS创建服务实例时被调用。
service()
注册一个支持构造函数的服务,它允许我们为服务注册一个构造函数。
接受两个参数:
- name(字符串):要注册的服务名称。
- constructor(函数):构造函数,调用它来实例化对象。
服务的应用
- 在多个控制器中调用服务。
- 代码示例:
<body>
<div ng-app="myApp">
<div ng-controller="FCtrl">
<input type="text" ng-model="data.msg">
{{data.msg}}
</div>
<div ng-controller="SCtrl">
<input type="text" ng-model="data.msg">
{{data.msg}}
</div>
</div>
</body>
<script>
var app = angular.module('myApp', []);
app.factory('Data',function(){
return{msg:"我来自factory"}
})
app.controller('FCtrl', function($scope,Data) {
$scope.data = Data;
});
app.controller('SCtrl', function($scope,Data) {
$scope.data = Data;
});
</script>
可以看到,我们使用了两个控制器,两个控制器的数据来源都来自Data,所以这段代码的运行结果是两个表单数据,改变一个时另一个也会同时改变。
- 效果: