Как вызвать функцию как динамически строку в AngularJS?

Question

Как использовать function assigned variable в ng-click??Я пробовал тремя способами ниже, но это тоже не работает.

Не могли бы вы дать мне знать, возможно это или нет ???если да, то как?

var app = angular.module("app", []);
app.controller("name", function($scope) {

 $scope.showname = function()
 {
 alert("Ramesh");
 }
 
 $scope.variable1 = $scope.showname;
  
 $scope.variable2 = "showname()";
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="name">
<button type="button" ng-click="variable1" tabindex="10003" >Not working 1 </button>

<button type="button" ng-click="$scope[variable2]()" tabindex="10003" >Not working 2 </button>

<button type="button"  ng-click="variable2" tabindex="10003" >Not working 3 </button>

<button type="button" ng-click="showname()" tabindex="10003"> working </button>
</div>

Answer 1

Вместо использования $scope используйте ключевое слово this:

Ошибочный

<button type="button" ng-click="$scope[variable2]()" tabindex="10003" >
     Not working 2 
</button>

Вместо этого используйте:

<button type="button" ng-click="this[variable2]()" tabindex="10003" >
     working
</button>

Можно получить доступ к объекту контекста, используя идентификатор this.

Для получения дополнительной информации см. Руководство разработчика AngularJS - Контекст выражения .

Answer 2

Попробуйте:

<button type="button" ng-click="variable1()" tabindex="10003" >Now it'll work 1 </button>

Рабочий плункр

Answer 3

$scope.showname имеет ссылку на функцию. Так что просто присвойте его вашей переменной, как

$scope.variable1 = $scope.showname

А затем позвоните в ng-click как valiable1()

var app = angular.module("app", []);
app.controller("name", function($scope) {

 $scope.showname = function()
 {
 alert("Ramesh");
 }
 
  $scope.variable1 = $scope.showname;
  
  $scope.variable2 =  $scope.showname;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="name">
<button type="button" ng-click="variable1()" tabindex="10003" >Not working 1 </button>

<button type="button" ng-click="variable2()" tabindex="10003" >Not working 2 </button>

<button type="button"  ng-click="variable1()" tabindex="10003" >Not working 3 </button>

<button type="button" ng-click="showname()" tabindex="10003"> working </button>
</div>

Answer 4

Вы можете использовать метод $scope.$eval и вызывать функцию как variable2().

$eval метод не оценивает JavaScript; они оценивают только AngularJS выражений.

Также для строки ниже

$scope.variable1 = $scope.showname;

Вы просто сохраняете ссылку на свою функцию showname. Вы должны вызвать его

<button type="button" ng-click="variable1()" tabindex="10003" >Not working 1 </button>

var app = angular.module("app", []);
app.controller("name", function($scope) {

 $scope.showname = function()
 {
 alert("Ramesh");
 }
 
  $scope.variable1 = $scope.showname;
  
  $scope.variable2 = $scope.$eval("showname");
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="name">
<button type="button" ng-click="variable1()" tabindex="10003" >Not working 1 </button>

<button type="button" ng-click="variable2()" tabindex="10003" >Not working 2 </button>

<button type="button"  ng-click="variable2()" tabindex="10003" >Not working 3 </button>

<button type="button" ng-click="showname()" tabindex="10003"> working </button>
</div>