passing "this" in ng-repeat content

Question

I am using ng-repeat in table for generating the table rows dynamically. I need to call a function with "this" keyword when user clicks on a check box in the table. When I am passing this as an argument its coming undefined on the js side. please help me below is my code

<table class="codelisttab">
<tr><th></th><th>Employee Name</th><th>Employee Id</th></tr>
<tr data-ng-repeat="emp in employees">
<td style="width:20px;"><a data-ng-click="updateEmployeeList(emp.empid, this)" class="ui-multiselect-box commonMultiSelectClass unCatMultiselectColorSelected" id="unCatMulti_109812"></a></td>
<td>{{emp.name}}</td><td>{{emp.empid}}</td>
</tr>
<tr colspan="3"><th style="text-align:center;"><input type="button" data-ng-click="addGroup()" value="Create Group"></th></tr>

My js code:

        $scope.updateEmployeeList = function(empid, obj){
            var i = $scope.employeeList.indexOf(empid);
            if(i <= -1){
                $scope.employeeList.push(empid);
                obj.style.backgroundColor="#89e3f9";
            }
            else{
                obj.style.backgroundColor="#0e5061";
                $scope.employeeList.splice(i,1);
            }
            console.log($scope.employeeList.toString());
        }

Changing the style of an object via javascript is not the "angular" way of doing things. Use `ng-class` to accomplish this. https://docs.angularjs.org/api/ng/directive/ngClass — navigator, Oct 23 '15 at 13:08
If you want the element yo need to pass $event to ng-click and get event.currentTarget: http://stackoverflow.com/questions/23107613/get-original-element-from-ng-click — Alexander Arutinyants, Oct 23 '15 at 13:09

score 0 · Answer 1 · answered Oct 23 '15 at 13:10

If you are gonna need a special context to the function updateEmployeeList you can always bind the specific context previously, for instance:

$scope.updateEmployeeList = $scope.updateEmployeeList.bind(this);

And it will be executed with the right context.

However, this is not very angular-ish.

score 0 · Answer 2 · edited May 23 '17 at 11:44

What do you expect this to be? If you want the element yo need to pass $event to ng-click and get event.currentTarget: get original element from ng-click

<a data-ng-click="updateEmployeeList(emp.empid, $event)" class="ui-multiselect-box commonMultiSelectClass unCatMultiselectColorSelected" id="unCatMulti_109812"></a>

$scope.updateEmployeeList = function(empid, $event){

            var i = $scope.employeeList.indexOf(empid),
            obj = $event.currentTarget;
            if(i <= -1){
                $scope.employeeList.push(empid);
                obj.style.backgroundColor="#89e3f9";
            }
            else{
                obj.style.backgroundColor="#0e5061";
                $scope.employeeList.splice(i,1);
            }
            console.log($scope.employeeList.toString());
        }

passing "this" in ng-repeat content

2 Answers2