从控制器向Angular工厂传递参数

Passing Parameter to Angular Factory from controller

本文关键字:参数 工厂 Angular 控制器      更新时间:2023-09-26

我无法将参数从角控制器传递到工厂。有谁能帮我一下吗?它可以在不传递参数的情况下工作,但当我传递它时,它不是。

var app = angular.module('employee', ['ui.grid', 'ui.grid.saveState', 'ui.grid.selection', 'ui.grid.cellNav', 'ui.grid.resizeColumns', 'ui.grid.moveColumns', 'ui.grid.pinning', 'ui.bootstrap', 'ui.grid.autoResize','ui.grid.pagination']);
app.controller('EmpCtrl', ['$scope', '$http', '$interval', '$modal', '$log', 'gridService', function ($scope, $http, $interval, $modal, $log, gridService) {
    $scope.LoadNextPage = gridService.LoadNextPage("5");
}]);
var gridService = function ($http, $rootScope) {
    return {
        LoadNextPage: function (hh) {
            alert(hh);
        },
        gridOptions:gridOptions
    };
};
app.factory('gridService', ['$http', '$rootScope', gridService]);

我是这样在视图

中使用它的
<span id="pcNext"
      class="glyphicon glyphicon-step-forward"
      ng-click="LoadNextPage()">
</span>

问题出在你的控制器:

$scope.LoadNextPage = gridService.LoadNextPage("5");

这意味着您的LoadNextPage而不是函数,而是调用您的服务中的函数的结果。顺便说一句,它不返回任何东西,而只是显示一个警告。但在你看来,你使用LoadNextPage作为一个函数调用…

将其更改为这样控制器的LoadNextPage将是一个可以从视图调用的函数。

$scope.LoadNextPage = gridService.LoadNextPage;

和在你看来:

<span id="pcNext"
      class="glyphicon glyphicon-step-forward"
      ng-click="LoadNextPage(5)">
</span>

应该可以。

注意:我怀疑您的gridOptions是在您在问题中提供的代码范围之外的某个地方定义的,以便它不会因为丢失(可能)对象而抛出和错误。所以我认为这是你代码中的一个错别字,而不是实际问题。

不想在视图中使用参数?

没有问题。您既可以创建包装器函数,也可以将其绑定到代码中的特定参数:

// wrap
$scope.LoadNextPage = function() {
    return gridService.LoadNextPage("5");
};
// bind
$scope.LoadNextPage = gridService.LoadNextPage.bind(this, 5);

或者bake number in your service.

这里的问题是gridOptions:gridOptions没有定义,会抛出错误。从factory中删除,gridOptions:gridOptions

检查工作代码片段并与您的代码进行比较。

var app = angular.module('employee', []);
app.controller('EmpCtrl', ['$scope', 'gridService', function ($scope, gridService) {
 $scope.clickMe = function() {
   $scope.LoadNextPage = gridService.LoadNextPage("5");
 }
}]);
var gridService = function() {
  return {
    LoadNextPage: function (hh) {
     alert(hh);
   }
 };
};
app.factory('gridService', ['$http', '$rootScope', gridService]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="employee" ng-controller="EmpCtrl">
  <button ng-click="clickMe()">Button</button>
</div>

您没有定义gridOptions函数参见此链接:

angular.module("myApp", []).controller("myCon", function($scope, $interval, gridService){
  $scope.LoadNextPage = gridService.LoadNextPage("5");
}).factory('gridService', ['$http', '$rootScope', gridService]);
function gridService($http, $rootScope){
  return {
        LoadNextPage: function (hh) {
            alert(hh);
        }
    };
}

查看此链接