Как получить текст кнопки для события ng-click в компоненте AngularJS

Question

Я создал компонент в AngularJS для многократно используемых кнопок. Мне нужно передать текст кнопки в аргумент функции через событие ng-click той же кнопки. Однако я не могу получить текст кнопки при вызове функции.

Любая помощь будет принята с благодарностью.

Ниже приведен мой код.

Указатель. html

<div class="object-actions" ng-repeat="val in value">
   <button-control  ng-repeat="v in val" name="{{v}}"></button-control>
</div>

Компонент

(function() {
  "use strict";
  angular
    .module("buttonCtrl", [])
    .component("buttonControl", {
      template: `<button ng-click="getName('$ctrl.name')">{{$ctrl.name}}</button>`,
      controller: buttonCtrl,
      bindings: {
        name: "@"
      }
    });

  buttonCtrl.$inject = ["$scope"];

  function buttonCtrl($scope) {
    $scope.getName = function(name) {
      alert(name);
    };
  }
})();

Выход введите описание изображения здесь

Answer 1

Проблема в том, что вы передаете переменную с кавычками, и она становится строкой.

ERRONEOUS

ng-click="getName('$ctrl.name')"

Однако вам не нужно передавать ее в функцию для его печати, а также нет необходимости вводить $scope:

function buttonCtrl() {
    var ctrl = this;

    ctrl.getName = function() {
      alert(ctrl.name);
    };
}

BETTER

ng-click="$ctrl.getName()"