Getting controller name from $parent in AngularJS

Question

I have converted one of my Angular controllers to Controller As syntax, but I am having trouble getting an ng-grid template to play nicely.

The controller has a function called edit user that looks like this

self.editUser = function (user_data) {
    var modalInstance = $modal.open({
        templateUrl: '/admin/views/adminuser.html',
            controller: 'AdminUserController',
            resolve: {
                user_data: function () {
                    return user_data;
                }
            }
        });

        modalInstance.result.then(function () {
            self.myQueryData.refresh = !self.myQueryData.refresh;
        });
    };

the ng-grid template looks like this

<div class="ngCellText" ng-class="col.colIndex()">
    <a ng-click="$parent.$parent.$parent.$parent.editUser({user_id:row.entity.id, first_name:row.entity.first_name, last_name:row.entity.last_name, email:row.entity.email})">
        <span ng-cell-text translate>Edit</span>
    </a>
</div>

and my route looks like this

.when('/admin/settings', {
    templateUrl: '/admin/views/settings.html',
    controller: 'SettingsController as sc',
})

So the problem is in the template when I call

$parent.$parent.$parent.$parent.editUser

it doesn't know what I am talking about unless I include the controller name like

$parent.$parent.$parent.$parent.sc.editUser,

then it works great. However I don't want to bind this template directly to the sc controller. How can I call the editUser without using the controller name?

I was hoping there would be a function on the $parent that would supply the function name like

$parent.$parent.$parent.$parent.getController().editUser

Any suggestions?

I should add, I know I can get this to work by adding the function to the scope, I don't want to have to do that. — ryanmc
– ryanmc, Commented Oct 30, 2015 at 18:20
Hmm... that's a lot $parent traversing. Similar ngGrid issue — Xeon
– Xeon, Commented Oct 30, 2015 at 18:23

Ravi Dasari · Accepted Answer · 2015-10-30 18:57:47Z

You can call functions on parent scope directly without referring to $parent. Because you might get in to trouble later when you modify your view structure.

example:

<div ng-app="MyApp">
<div ng-controller="MyController">
    {{myMessage}}
    <div ng-controller="MyController2">
        <div ng-controller="MyController3">
            <div ng-controller="MyController4">
                <button id="myButton" ng-click="setMessage('second')">Press</button>
            </div>
        </div>
    </div>
    <script>
        angular.module('MyApp', [])
           .controller('MyController', function($scope) {
            $scope.myMessage = "First";
               $scope.setMessage = function(msg) {
                $scope.myMessage = msg;
               };
        }).controller('MyController2', function($scope) {

           }).controller('MyController3', function($scope) {

           }).controller('MyController4', function($scope) {

           });
    </script>

</div>
</div>

Or else you can use angular $broadcast

Constantine Poltyrev · Accepted Answer · 2015-10-30 18:53:13Z

0

Since you are using controllerAs syntax, you can address your controller by the alias, so the actual template line will look like this:

<a ng-click="sc.editUser({user_id:row.entity.id, first_name:row.entity.first_name, last_name:row.entity.last_name, email:row.entity.email})">

answered Oct 30, 2015 at 18:53

Constantine Poltyrev

1,02410 silver badges12 bronze badges

3 Comments

ryanmc Over a year ago

As I said in the question I don't want to bind this template to that specific controller. I want it to usable by multiple controllers

Constantine Poltyrev Over a year ago

I usually use a uniform alias for all controllers, so this approach would work if you are ok with aliasing similar controllers with the same name. Otherwise you should either directly expose your method to $scope or use $scope.broadcast as Ravi has suggested.

ryanmc Over a year ago

that would make nesting controllers very difficult. I will try out broadcast

Collectives™ on Stack Overflow

Getting controller name from $parent in AngularJS

2 Answers 2

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related