Creating common controller functions

How do I create some sort of utils bundle that would be accessible from all my controllers?

I have this route code in my main module:

'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'});
}]);

I want a function that can be common to HomeCtrl , AdminCtrl and MainAppCtrl .

How should I do it in AngularJS?

---

The way to define common code in angular is through Services.

You would define a new service like so :

.factory('CommonCode', function ($window) {
        var root = {};
        root.show = function(msg){
            $window.alert(msg);
        };
        return root;
    });

In your controller you would inject this service..like so

function MainAppCtrl($scope,CommonCode)
{
     $scope.alerter = CommonCode;
     $scope.alerter.show("Hello World");
}

Just include CommonCode as an argument to your controller function.. Angular will take care of injecting it for you ( Read on Dependancy Injection ..to understand what is happening here. )

---

Just to update previous answer (which only define what factory is), there are 3 ways to inject dependencies (define common code) in AngularJS:

Providers

Factories

Services

I will not talk much about provider because it is a more laborious method for dependency injection. However, this page explains very well how they work.

---

Technically, service and factory are used for the same thing. It turns out, a service is a constructor function whereas a factory is not.

From this post:

module.service( 'serviceName', function );

When declaring serviceName as an injectable argument you will be provided with an instance of the function .

module.factory( 'factoryName', function );

When declaring factoryName as an injectable argument you will be provided with the value that is returned by invoking the function reference passed to module.factory.

---

You can use the one you prefer and obtain the same result .

Here is two codes doing exactly the same thing through service first, and then factory :

Service syntax

app.service('MyService', function () {
  this.sayHello = function () {
    console.log('hello');
  };
});

Factory syntax

app.factory('MyService', function () {
  return {
    sayHello: function () {
      console.log('hello');
    }
  }
});

链接地址: http://www.djcxy.com/p/2176.html

上一篇: 角js未知提供商

下一篇: 创建通用控制器功能