is it Possible (partial class) concept for controller in angularjs?

Question

Is there any way to do code grouping using partials in angularjs?

Reason --- I have a controller which contains too much code. This controller contains the code For several Methods and a lot of functionalities, it reduces the readability of the code. I want to keep controller name the same and do code grouping.

Ex:-

app.controller('MainController', function ($scope, router) {
    $scope.Read = function() {

    };
    $scope.Write = function() {

    };
    $scope.Update = function() {

    };
    $scope.Delete = function() {

    };
});

Partial:

    app.controller('MainController', function ($scope, router) {
        $scope.firstName = firstname;
        $scope.middleName = middleName;
        $scope.lastName = lastName;
    });

Another Partial:

    app.controller('MainController', function ($scope, router) {
        $scope.Print = function() {

        };
        $scope.PrintPreviw = function() {

        };
    });

I need to implement it like this.

Is there any other way? yes please update.. Thanks

This might help http://stackoverflow.com/questions/25819661/how-to-split-single-controller-in-multiple-js-files-in-angularjs — PSK, Feb 04 '16 at 12:33
Possible duplicate of [Javascript: add methods to function prototype](http://stackoverflow.com/questions/23020290/javascript-add-methods-to-function-prototype) — g19fanatic, Feb 04 '16 at 12:33
@SureshB Do you mean seperate the functions into their own controller or class? — Katana24, Feb 04 '16 at 12:35
Yes, In Single controller I have lot fn and variables.. so i want to do grouping the code. — Suresh B, Feb 04 '16 at 12:36
It is generally bad form to have one controller that does so much that you need to split it into multiple files. I would suggest having multiple controllers (using directives or ui-router and multiple views) and/or breaking out any functional code you have in your controller into services. — Dave Bush, Feb 04 '16 at 14:16

Tim · Answer 1 · 2017-10-05T12:15:49.157

You could try to sort the code into logical chunks. after that, you could merge logical chunks into objects.

//Do NOT do this!
$scope.firstName = firstname;
$scope.middleName = middleName;
$scope.lastName = lastName;

//instead do this
var person = {
    firstname: "name",
    middleName: "mName",
    lastName: "Lname"
}

//then in your view access them like this
{ { person.firstname } }

Also, you could move some code into services or factories. then use those methods inside of your controller.

//take things out of your controller and put then in a service or factory.
app.service('notePad', function () {
    return {

        Read: function (newState) {
            return state += state;
        },

        Write: function (state) {
            return state += state;
        },
        Update: function (state) {
            state = state;
        },
        Delete: function () {
            state = null;
        }

    };
});

//then in your controller access them like this
//Note you do not need everything on $scope if you are not going to use it in the view.
app.controller('MainController', function ($scope, router, notePad) {
    $scope.Read = notePad.Read();
    $scope.Write = notePad.Write();
    $scope.Update = notePad.Update();
    $scope.Delete = notePad.Delete();
});

If you need the functionality of a controller inside of a service you can still access scope and other controller properties like this.

NOTE: Make sure you create an onDestroy method to clean up any leftover variables.

//pass your scope to your service
app.controller('MainController', function ($scope, router, notePad) {
    notePad.changeView($scope);
});

//munipulate your scope just like you would in a controller
app.service('notePad', function () {
    function changeView(scope) {
        scope.write = 'example';
    }
});

//the result of the scope change in the service will show up in the view
{ { write } } == 'example'

Hi matt, what you explain that is correct we are doing same for sample I put like that. Even in controller lot of fn thr is possible partial controller? — Suresh B, Feb 04 '16 at 14:34
I added an example of doing controller work outside of the controller. most everything that is done in the controller can be done outside of the controller as well. I am not sure how to split a controller into two but I do know you can to the controllers work outside of the controller. This would allow you to split up your current controllers work flow. I hope this helps! — Tim, Feb 04 '16 at 20:37

is it Possible (partial class) concept for controller in angularjs?

1 Answers1