13

我想在 angularjs 服务中编写一个函数，并且我想在我的所有服务中重用它

控制器。

var mod= angular.module('myapp', ['eventFilters', 'highlight', 'event', 'dayfilter', 'Services']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
      when('/', {templateUrl: 'template.html',   controller: Ctrl}).
      when('/temp', {templateUrl: 'temp.html',   controller: tempCtrl}).
      otherwise({redirectTo: '/invalid'});
}]);
mod.service ('sharedService', function() {
function daysInMonth(month,year) {
    return new Date(year, month+1,0).getDate();
}
});

我想在我的任何控制器中使用 daysInMonth 函数。可能吗？如果是这样，任何人都可以用小提琴中的一些例子简要解释一下我。

提前致谢

4

6 回答 6

26

这是一个关于如何在控制器中使用（注入）服务的基本示例。

http://jsfiddle.net/uhmNR/1/

var myApp = angular.module('myApp',[]);


//Here is the service Users with its functions and attributes
//You can inject it in any controller, service is a singleton and its data persist between controllers
myApp.factory('Users', function () {

    var userName = "John Doe";

    return {
        getUserName: function () {
             return userName;                   
        },
        setUserName: function (newName) {
            userName = newName;
        }
    }
});

//An Util service with DaysInMonth method   
myApp.factory('Util', function () {

    return {
        daysInMonth: function (month,year) {

            return new Date(year, month+1,0).getDate();
        }
    };

});   

//Here I am injecting the User service andusing its methods   
myApp.controller('MyCtrl', ['$scope', 'Users', 'Util', function ($scope, Users, Util) {

    Users.setUserName('Robin Hood');

    $scope.name = Users.getUserName();

    //Using Util.daysInMonth()
    $scope.date = Util.daysInMonth(12,2012);
}]);

希望能帮助到你。

于 2012-12-19T12:46:07.737 回答
6

将函数公开为服务，然后让 AngularJS 注入器完成其余工作。您可以轻松地将daysInMonth服务设置为模块中的静态值。在http://jsfiddle.net/hbulhoes/zdtnw/上查看此操作

var mod = angular.module('myapp', []);

// This is the declaration of the daysInMonth service. It's set as
// a value in the module, with the value being the very function
// you want to share among other services and controllers:
mod.value('daysInMonth', function(month, year) {
    return new Date(year, month+1,0).getDate();
});

// And this is an example controller that depends on the daysInMonth function.
function MyController($scope, daysInMonth){
    $scope.DaysInCurrentMonth = daysInMonth(12, 2012);
}
于 2012-12-19T13:02:02.723 回答
1

如果您希望所有控制器都可以使用某个功能，则可以考虑在 $rootScope 上定义该方法，而不是使用服务：

myApp.run(function($rootScope) {
    $rootScope.daysInMonth = function(year, month) {
        return new Date(year, month+1,0).getDate();
    }
});

然后，由于原型作用域继承，所有控制器的作用域都可以访问该方法（无需依赖注入）。您可以像这样在任何控制器中调用它：

function MyCtrl($scope) {
   console.log($scope.daysInMonth(12, 2012));
}​

JavaScript 不会找到 $scope 上定义的函数 daysInMonth，所以它会在父作用域（在本例中是根作用域）中查找该函数，然后找到它。

于 2012-12-19T16:28:52.327 回答
1

你需要暴露它。将其包装在一个返回块中：

var mod= angular.module('myapp', ['eventFilters', 'highlight', 'event', 'dayfilter', 'Services']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
  when('/', {templateUrl: 'template.html',   controller: Ctrl}).
  when('/temp', {templateUrl: 'temp.html',   controller: tempCtrl}).
  otherwise({redirectTo: '/invalid'});
}]);
mod.service ('sharedService', function() {
   return {
      daysInMonth: function(month,year) {
         return new Date(year, month+1,0).getDate();
      }
   };
});
于 2012-12-20T08:19:25.103 回答
0

如果您想使用实际的 Angular服务（不是工厂或提供者），那么您所要做的就是按照 Angular 的方式创建一些东西。

mod.service ('sharedService', function() {
  function daysInMonth(month,year) {
    return new Date(year, month+1,0).getDate();
  }
});

// Would turn into 

mod.service("sharedService", function(){
  this.daysInMonth(month, year){
    return new Date(year, month + 1, 0).getDate();
  }
});

除非您需要覆盖将在服务为NEW'ED时创建的默认THIS对象，否则您不应从服务中返回。在这种情况下，您可以返回 Object Literal、Function Definition、Array、大多数 Objects，不包括任何原语。只需确保您提出“为什么我需要覆盖默认行为？”的问题。

这就是服务的全部意义所在。当您注入SERVICE Angular 时，将新建您传递的函数，从而按照描述将其返回给您。就您而言，该服务正是您所需要的。Angular 将只构建一次服务，并且新的 sharedService函数结果将在整个应用程序中可用，但仅当服务在应用程序中的某个位置至少被 DI 一次时。如果你不 DI 它，那么服务将永远不会被创建，因为它是延迟加载的（工厂和服务）。

如果你发现你真的想要返回一些东西，（尽管你可以在服务中这样做），合适的地方应该是在 Angular Factory中。事实上，如果你不从工厂回来，你会收到一个很好的小通知

错误： 提供者“sharedService”必须从 $get 工厂方法返回一个值。

注意：$get函数是服务函数定义的第二个参数。

mod.factory("sharedService", function(){
  function daysInMonth(month, year){
    return new Date(year, month + 1, 0).getDate();
  }

  return {
    daysInMonth: daysInMonth
  }

  // Or you could do this...
  return daysInMonth;
});

使用 Angular Factory时，您不再获得NEW'ED函数，这就是必须创建 return 的原因。

于 2016-11-21T16:37:57.930 回答
0

我认为 OP 意味着该服务是一个函数，例如 $timeout 函数。由于默认服务工厂对您返回的任何内容进行“服务”，您可以这样做：

angular.module('myApp.myModule',[])
.factory('add',['$injectables',function($injectables) {
  return function(arg1,arg2)
  {
    //this is the function that will be called when you use this service
    return arg1 + arg2;
  }
}]);

用法：

angular.module('myApp.Othermodule',['myApp.myModule'])
.controller('controllername',['add',function(add) {

  //controller code and somehwere
  $scope.z = add($scope.x,$scope,y);
}]);

于 2017-09-12T18:34:31.837 回答