Question

我试图获取变量中选中的按钮的名称，然后执行某些操作（更改的内容）。

<form>
    <button name="paypal" class="moyen-payement-button" ng-class="{actif: actifSelected.selectedButton === 1}" ng-click="actifSelected.select(1)">
        <img src="images/payement-methods/paypal.svg" alt="Paypal" class="paypal" />
    </button>
    <button name="creditCard" class="moyen-payement-button" ng-class="{actif: actifSelected.selectedButton === 2}" ng-click="actifSelected.select(2)">
         <img src="images/payement-methods/credit-card.svg" alt="Carte de crédit" class="creditCard" />
    </button>
</form>

<p>Name of my button: </p>
<p>1</p>

与＆＃34; 1＆＃34;必须改变＆＃34; 2＆＃34;如果选择了按钮creditCard，我会找到ng-show / ng-hide，但我想我可以简单地修改的内容而不创建另一个？

Answer 1

您可以使用：

<button ng-click="actifSelected.select($event,1)"></button>

在你的控制器中，你可以使用$ event来触发元素

$scope.actifSelected.select = function($event, value) {
    var button = angular.element($event.currentTarget);
    var buttonName = button.attr("name");
}

Answer 2

您可以使用以下表达式：

<p>{{ actifSelected.selectedButton === 1 ? '1' : '2' }}</p>

Answer 3

您可以将$ event传递给ng-click：

  <button name="hello" ng-click="myFunction($event, 2)">Test</button>
  <p>{{btnName}}</p>
  <p>{{arg1}}</p>

在控制器中使用它：

$scope.myFunction = function(e, arg1) {
  $scope.arg1 = arg1;
  console.log(e.target.name);
  $scope.btnName = e.target.name;
}

请参阅此Plunkr

Answer 4

只需在

中显示selectedButton变量显示

 <p>{{actifSelected.selectedButton}}</p>

以角度获取按钮名称

4 个答案: