How to access method in controller from another in angularjs

Question

How can i access a method in tableController from my menuController. Here is my code.i want to call addRow() method from select() in menu controller. these controllers are in different modules.Please Help me.

     my menu controller
     var menuApp = angular.module('menuApp', []);
menuApp.controller('menuController', ['tableService', function ($scope, tableService) {
    $scope.menuItem = [
        {
            id: 1,
            title: "new",
            navigate:"N",
            child: [{
                id: 11,
                title: "new11",
                navigate: "N",
                child: [{
                    id: 12,
                    title: "new12",
                    navigate: "Y",
                    url:"/Home/index"
                }]
            }]
        },
        {
            id: 2,
            title: "new",
            child: [{
                id: 21,
                title: "new21",
                child: [{
                    id: 22,
                    title: "new22"
                }]
            }]
        }
    ];

    $scope.select = function (data) {
        if (data.navigate == "Y") {
            alert(data.url);
            tableService.add();
        }
    }
}]);

my table controller

     tableApp.controller('tableController', function ($scope, $rootScope,      $filter, $uibModal) {
    $scope.filteredPeople = [];

    $scope.currentPage = 1;
    $scope.pageSize = 10;
    $scope.people = [{ id: "1", name: "joe",disable:true },
                 { id: "2", name: "bill", disable: true },
                 { id: "3", name: "john", disable: true },
    { id: "1", name: "joe", disable: true },
                 { id: "2", name: "bill", disable: true },
                 { id: "3", name: "john", disable: true },
    { id: "1", name: "joe", disable: true },
                 { id: "2", name: "bill", disable: true },
                 { id: "3", name: "john", disable: true },
    { id: "1", name: "joe", disable: true },
                 { id: "2", name: "bill", disable: true },
                 { id: "3", name: "john", disable: true },
    { id: "1", name: "joe", disable: true },
                 { id: "2", name: "bill", disable: true },
                 { id: "3", name: "john", disable: true }];

    $scope.addRow = function () {
        debugger;
        $scope.people.unshift({
            id: "",
            name: "",
            disable:false
        });
        $scope.getPage();
    }

    $scope.getPage = function () {
        var begin = (($scope.currentPage - 1) * $scope.pageSize);
        var end = begin + $scope.pageSize;
        $scope.filteredPeople = $filter('filter')($scope.people, {
            id: $scope.idFilter,
            name: $scope.nameFilter

        });
        $scope.totalItems = $scope.filteredPeople.length;
        $scope.filteredPeople = $scope.filteredPeople.slice(begin, end);
    };
    $scope.getPage();

    $scope.pageChanged = function () {
        $scope.getPage();
    };
    $scope.open = function () {
        $scope.id = generateUUID();
    };
    $scope.dblclick = function (index) {
        for (var i = 0; i < $scope.filteredPeople.length; i++) {
            $scope.filteredPeople[i].disable = true;
        }
        return index.disable = false;
    }
    $scope.rowSelect = function (rowdata) {
        alert(rowdata.name);
    }
    $scope.openInput = function (index) {
        debugger;
        var modalInstance = $uibModal.open({
            templateUrl: '/Home/index',
            controller: 'testController',
            resolve: {
                items: function () {
                    return index;
                },
                cat: function () {
                    return 'Account';
                }
            }
        });
    }

});

I think you can create a service with the fonctions you want to share between controllers & directives — AlainIb
– AlainIb, Commented Dec 22, 2015 at 12:55
@Alainlb i created a service named tableService. but that was not work for me. can u paste a example here? — Ajith
– Ajith, Commented Dec 22, 2015 at 12:57
It is not a good practice to call controller methods inside other controller. Like @Alainlb suggested is better if you create a separate service that you can inject in other components. This way your code is DRY, more modular and more flexible. — Mirceac21
– Mirceac21, Commented Dec 22, 2015 at 12:58

AlainIb · Accepted Answer · 2015-12-22 13:08:31Z

1

Example of a service shared between controllers & directives

/**
 * store and share data between controllers & directives
 */
angular.module('interfaceApp').service('shareData', function () {
    this.datas = [];

    this.add = function (data) {
        this.datas.push(data);
    };

    //retourne l'élément correspondant à la clé ( utilise la date comme clé )
    this.getElement = function (key) {
        ......
        return ;
    };

    this.getDatas = function () {
        return this.datas;
    };

});


/* Controller */
var searchModule = angular.module('searchModule', []);
   // inject the service in the controller
.controller('searchCtrl', function ($scope, shareData ) {

        shareData.add( ... );

        console.log( shareData.getDatas() );

});

A service is a singleton, so all controllers using it acces to the same datas ( when they call shareData.getDatas() )

edited Dec 22, 2015 at 13:08

answered Dec 22, 2015 at 13:03

AlainIb

4,6156 gold badges42 silver badges67 bronze badges

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

3 Comments

Ajith Over a year ago

Alainlb , but i want to access method in another controller. i dnt want to get data , i am trying to push data.

AlainIb Over a year ago

shareData.add( ... );

Ajith Over a year ago

@Alainlb Thank you. its work for me. but its works only when when i add var app =angular.module('interfaceApp',[]); app.service('shareData', function () { this.datas = []; ...................................... – Ajith 6 mins ago add a comment

Collectives™ on Stack Overflow

How to access method in controller from another in angularjs

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related