Reuse AngularJS controller logic

Question

This is the code of one controller from my application, in the User page.

app.controller('UserCtrl', ['$scope', '$http', function ($scope, $http) {

$http.get('/Users/GetUsers').success(function (data) {
    $scope.data = data;
});

this.search = function () {
    $http.post('/Users/SearchUser', $scope.search).success(function (data) {
        $scope.data = data;
    });
}

this.delete = function() {....}
}]);

On another page, the Permission page, I create a controller with the same logic

app.controller('PerCtrl', ['$scope', '$http', function ($scope, $http) {

$http.get('/Permission/GetPermissions').success(function (data) {
    $scope.data= data;
});

this.search = function () {
    $http.post('/Permission/SearchPermission', $scope.search).success(function (data) {
        $scope.data = data;
    });
}

this.delete = function() {....}
}]);

As you can see, the only different is the URL. How can I reuse the logic from a controller to another?

Shomz · Accepted Answer · 2014-12-02 03:05:38Z

1

That is exactly what services are for.

So instead of:

$http.get('/Permission/GetPermissions').success(function (data) {
    $scope.data= data;
});

You'd call something like:

permissionsService.get().then(function (data) {
    $scope.data= data;
});

And:

this.search = function () {
    $http.post('/Permission/SearchPermission', $scope.search).success(function (data) {
        $scope.data = data;
    });
}

Replaced with something like:

this.search = function () {
    searchService.search().then(function (data) {
        $scope.data = data;
    });
}

etc...

Generally, all server calls should be in services anyway, so there's a great opportunity to improve your code and learn how to do it right.

answered Dec 2, 2014 at 3:05

Shomz

37.7k4 gold badges61 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Huy Hoang Pham Over a year ago

I know about the service, but if I use the service, I still have to declare the "search, delete" in each controller. What I want is create a parent controller, other controller inherit from it, and I only need to configure the url for Get and Search, Delete .... or something like that.

Shomz Over a year ago

Well then, create a service that does all that for you... It's really a job for a service rather than a controller.

Collectives™ on Stack Overflow

Reuse AngularJS controller logic

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related