Why ng-click not working when i got in $scope.variabel?

Question

I have problem, my ngclick not working because i got in $scope.variabel controller.

<a id="data_table" ng-click="{{ item.target }}"

I think target can use in ng-click when we call {{ item.target }} but not working, any solution for me ? Thanks

and this is my code :

Controller

$scope.states = {};
$scope.states.activeItem = 'nav1';

$scope.items = [{
    id: 'nav1',
    target: 'home()',
    title: 'Home',
    icon: 'fa fa-home fa-3x'
}, {
    id: 'nav2',
    target: 'data_1()',
    title: 'Data 1',
    icon: 'fa fa-briefcase fa-3x'
}, {
    id: 'nav3',
    target: 'data_2()',
    title: 'Data 2',
    icon: 'fa fa-briefcase fa-3x'
},
{
    id: 'nav4',
    target: 'data_3()',
    title: 'Data 3',
    icon: 'fa fa-briefcase fa-3x'
},
{
    id: 'nav5',
    target: 'data_4()',
    title: 'Data 4',
    icon: 'fa fa-briefcase fa-3x'
},
{
    id: 'nav6',
    target: 'data_5()',
    title: 'Data 5',
    icon: 'fa fa-briefcase fa-3x'
}];

View

<li ng-repeat="item in items" ng-class="{'active': item.id == states.activeItem}" ng-click="states.activeItem = item.id">
<a id="data_table" ng-click="{{ item.target }}">
<i class="{{ item.icon }}" aria-hidden="true"></i>
<span class="title">{{ item.title }}</span>
<span class="selected"></span>
</a>
</li>

Answer 1

I guess you're retrieving data from JSON response from API. I'd say that create a wrapper method callToAction in as target as in variable name & then call method on ng-click.

Markup

<a id="data_table" ng-click="callToAction(item.target)"

$scope.callToAction = function(actionName){
   $scope[actionName]();
}