Javascript 在控制器AngularJS中组合公共函数

Javascript 在控制器AngularJS中组合公共函数,javascript,angularjs,angularjs-scope,angularjs-controller,code-reuse,Javascript,Angularjs,Angularjs Scope,Angularjs Controller,Code Reuse,我正在做这个项目。我正在使用分页、checkAll、deleteAll等功能,这些功能在所有控制器之间都是通用的。我希望将代码移到工厂或服务,以便所有控制器都能使用。我试过了,但不太清楚。我需要提示。 我知道如何创建工厂或服务,以及如何集成it控制器,但有点混淆了移动类似代码的逻辑 我给出了在所有控制器中编写的示例,以及用于排序和分页的逻辑 $scope.bigCurrentPage = 1; $scope.editIndex = ""; var sortKey = "name"; var s

我正在做这个项目。我正在使用分页、checkAll、deleteAll等功能,这些功能在所有控制器之间都是通用的。我希望将代码移到工厂或服务,以便所有控制器都能使用。我试过了,但不太清楚。我需要提示。 我知道如何创建工厂或服务,以及如何集成it控制器,但有点混淆了移动类似代码的逻辑

我给出了在所有控制器中编写的示例,以及用于排序和分页的逻辑

$scope.bigCurrentPage = 1;
$scope.editIndex = "";

var sortKey = "name";
var sortDirection = "ASC";
$scope.filterObj = {order: [sortKey + " " + sortDirection], limit: CONFIG.limit, offset: 0};
$scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;

$scope.sortList = function (inputSort) {
    if (sortKey === inputSort) {
        sortDirection = (sortDirection === "ASC") ? "DESC" : "ASC";
    } else {
        sortKey = inputSort;
    }
    $scope.filterObj.order = [sortKey + " " + sortDirection];
    $scope.pageChanged();
}


$scope.getSongs = function () {
    $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;
    Song.find({filter: $scope.filterObj})
            .$promise
            .then(function (data) {
                $scope.items = data;
                $scope.maxSize = 5;
                $scope.size = $scope.filterObj.limit;
                $scope.countingIndex = ($scope.bigCurrentPage - 1) * $scope.filterObj.limit; //Its idea to implement counting. Variable is not part of pagination..////     
            });
};


$scope.pageChanged = function () {
    $scope.getSongs();
};

$scope.pageChanged();

这样,假设我正在为相册执行此操作,并将sortKey更改为“id”,将服务与“Album.find”一起使用,将更改“filter”对象,我就完成了,但事实上,我在所有控制器中使用的是通用代码。如何更好地编写它。

您确实有很多属性很难在服务中维护,因此我建议您应该使用控制器而不是服务(或者将可重用变量放入服务中,这样会使代码更有意义)。下面创建的控制器可以使用
$controller
依赖项注入任何其他控制器

通用控制器

app.controller('commonCtrl', function($scope) {
    $scope.bigCurrentPage = 1;
    $scope.editIndex = "";

    var sortKey = "name";
    var sortDirection = "ASC";
    $scope.filterObj = {
        order: [sortKey + " " + sortDirection],
        limit: CONFIG.limit,
        offset: 0
    };
    $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;

    $scope.sortList = function(inputSort) {
        if (sortKey === inputSort) {
            sortDirection = (sortDirection === "ASC") ? "DESC" : "ASC";
        } else {
            sortKey = inputSort;
        }
        $scope.filterObj.order = [sortKey + " " + sortDirection];
        $scope.pageChanged();
    }

    $scope.getSongs = function() {
        $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;
        Song.find({
                filter: $scope.filterObj
            })
            .$promise
            .then(function(data) {
                $scope.items = data;
                $scope.maxSize = 5;
                $scope.size = $scope.filterObj.limit;
                $scope.countingIndex = ($scope.bigCurrentPage - 1) * $scope.filterObj.limit; //Its idea to implement counting. Variable is not part of pagination..////     
            });
    };

    $scope.pageChanged = function() {
        $scope.getSongs();
    };

    $scope.pageChanged();
});
您可以使用$controller dependency将创建的
commonCtrl
注入任何其他控制器,
commonCtrl
将其作用域共享给注入它的控制器。但是从
commonCtrl
中的
controllerA
所做的更改在
controllerB
中不可用,因为
commonCtrl
将其范围的副本提供给了注入它的控制器

控制器A

app.controller('controllerA', function($scope, $controller){
   $controller('commonCtrl', {$scope: $scope}); //inject commonCtrl scope to current scope
   //common scope will be available from here
}) 
注意

如果您想在其他控制器中反映更改,可以使用 与此控制器共享公共属性的服务 不同的控制器


您确实有很多很难在服务中维护的属性,所以我建议您应该使用控制器而不是服务(或者在服务中放置可重用变量,这样会使代码更有意义)。下面创建的控制器可以使用
$controller
依赖项注入任何其他控制器

通用控制器

app.controller('commonCtrl', function($scope) {
    $scope.bigCurrentPage = 1;
    $scope.editIndex = "";

    var sortKey = "name";
    var sortDirection = "ASC";
    $scope.filterObj = {
        order: [sortKey + " " + sortDirection],
        limit: CONFIG.limit,
        offset: 0
    };
    $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;

    $scope.sortList = function(inputSort) {
        if (sortKey === inputSort) {
            sortDirection = (sortDirection === "ASC") ? "DESC" : "ASC";
        } else {
            sortKey = inputSort;
        }
        $scope.filterObj.order = [sortKey + " " + sortDirection];
        $scope.pageChanged();
    }

    $scope.getSongs = function() {
        $scope.filterObj.offset = ($scope.bigCurrentPage - 1) * CONFIG.limit;
        Song.find({
                filter: $scope.filterObj
            })
            .$promise
            .then(function(data) {
                $scope.items = data;
                $scope.maxSize = 5;
                $scope.size = $scope.filterObj.limit;
                $scope.countingIndex = ($scope.bigCurrentPage - 1) * $scope.filterObj.limit; //Its idea to implement counting. Variable is not part of pagination..////     
            });
    };

    $scope.pageChanged = function() {
        $scope.getSongs();
    };

    $scope.pageChanged();
});
您可以使用$controller dependency将创建的
commonCtrl
注入任何其他控制器,
commonCtrl
将其作用域共享给注入它的控制器。但是从
commonCtrl
中的
controllerA
所做的更改在
controllerB
中不可用,因为
commonCtrl
将其范围的副本提供给了注入它的控制器

控制器A

app.controller('controllerA', function($scope, $controller){
   $controller('commonCtrl', {$scope: $scope}); //inject commonCtrl scope to current scope
   //common scope will be available from here
}) 
注意

如果您想在其他控制器中反映更改,可以使用 与此控制器共享公共属性的服务 不同的控制器


因为您使用的是一堆$scope,所以服务将不合适。使自己成为一个基本控制器类并从中继承。因为您使用的是一堆$scope,所以服务将不合适。让自己成为一个基本的控制器类并从中继承。你能用ControllerA中的bit例子解释一下吗。这会更容易。如何将依赖关系从controllerA传递到commonCtrl。因为我对不同的服务集使用相同的服务。还有一个问题,如果我在同一页上使用ControllerA和controllerB作为控制器,它会工作吗?它会分别为控制器A和B工作吗?不会,它只会将
commonCtrl
复制到
ControllerA
commonCtrl
ControllerA
的更改在
controllerB
中不可用,我将添加更多信息。您是否希望从
controllerA
进行的更改应在
controllerB
中提供。否,我认为这将从工厂实现,从controllerA进行的更改反映在controllerB中。我说得对吗?@Sankalp是的,你说得对,请看我的最新答案。你能在ControllerA中用bit示例解释一下吗。这会更容易。如何将依赖关系从controllerA传递到commonCtrl。因为我对不同的服务集使用相同的服务。还有一个问题,如果我在同一页上使用ControllerA和controllerB作为控制器,它会工作吗?它会分别为控制器A和B工作吗?不会,它只会将
commonCtrl
复制到
ControllerA
commonCtrl
ControllerA
的更改在
controllerB
中不可用,我将添加更多信息。您是否希望从
controllerA
进行的更改应在
controllerB
中提供。否,我认为这将从工厂实现,从controllerA进行的更改反映在controllerB中。我说得对吗?@Sankalp是的,你说得对,请看我最新的答案