如何创建某种可以从我的所有控制器访问的utils包?
我的主模块中有这个路径代码:
'use strict';
angular.module('lpConnect', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/home', {template: 'views/home.html', controller: HomeCtrl}).
when('/admin', {template: 'views/admin.html', controller: AdminCtrl}).
when('/connect', {template: 'views/fb_connect.html', controller: MainAppCtrl}).
otherwise({redirectTo: '/connect'});
}]);
我想要一个HomeCtrl
,AdminCtrl
和MainAppCtrl
共有的功能。
我应该如何在AngularJS中做到这一点?
答案 0 :(得分:63)
以角度定义公共代码的方法是通过服务。
您可以像这样定义一项新服务:
.factory('CommonCode', function ($window) {
var root = {};
root.show = function(msg){
$window.alert(msg);
};
return root;
});
在您的控制器中,您将注入此服务......如此
function MainAppCtrl($scope,CommonCode)
{
$scope.alerter = CommonCode;
$scope.alerter.show("Hello World");
}
只需将CommonCode作为参数包含在你的控制器函数中.Angular将负责为你注入它(阅读Dependancy Injection ..了解这里发生了什么。)
答案 1 :(得分:8)
只是为了更新之前的答案(仅定义factory
是什么),在AngularJS中有3种inject dependencies(定义公共代码)的方法:
我不会谈论提供者,因为它是依赖注入的一种更费力的方法。但是,this page很好地解释了它们的工作原理。
从技术上讲,服务和工厂用于同一件事。 事实证明,服务是构造函数,而工厂不是。
来自this post:
module.service( 'serviceName', function );
当您将
serviceName
声明为可注射参数时,您将会这样做 提供函数的实例。
module.factory( 'factoryName', function );
当您将
factoryName
声明为可注射参数时,您将会这样做 提供通过调用函数返回的值 引用传递给module.factory。
您可以使用您喜欢的那个并获得相同的结果。
以下两个代码首先通过service
执行完全相同的操作,然后 factory
:
服务语法
app.service('MyService', function () {
this.sayHello = function () {
console.log('hello');
};
});
工厂语法
app.factory('MyService', function () {
return {
sayHello: function () {
console.log('hello');
}
}
});