Angularjs获取按钮值

时间:2016-02-10 03:46:49

标签: angularjs

我需要使用angularjs获取按钮id值。我已经编写了代码,但我得到的值为"undefined"。所以请建议我需要使用的代码。

我的代码是:

 <button type="button"  class="btn btn-primary ole" data-toggle="tooltip"  id="buttonvalue" name="rdoResult"  value="SUN" ng-click="addvalue()"  ng-model="testDate23"  data-placement="left" data-original-title="this is a left tooltip">
      SUN
</button>

<button type="button"  ng-value="2"  class="btn btn-primary ole two" data-toggle="tooltip"  ng-click="addvalue()" 
 ng-model="testDate23" value="MON"  id="buttonvalue" data-placement="top" data-original-title="this is a top tooltip">
      MON
</button>

脚本代码:

$scope.addvalue = function() {
    var datevaluee=$scope.testDate23;
}

5 个答案:

答案 0 :(得分:2)

您需要在ng-click函数中传递$ event,如下所示..

   ng-click="addvalue($event)"
下面的

将是功能实现

    $scope.addvalue = function(element) {
      $scope.testDate23 = element.currentTarget.value; // this will return the value of the button
    console.log( $scope.testDate23)
   };

答案 1 :(得分:1)

你可以试试这个。

    <button ng-click="addvalue(testDate23='SUN')">
     button
    </button>

   <button ng-click="addvalue(testDate23='MON')">
    btn2
   </button>

查找小提琴Fiddle example

希望它会有所帮助。

答案 2 :(得分:0)

按钮是用于提交数据的输入,而不是设置数据。

答案 3 :(得分:0)

您需要使用指令。

jsfiddle上的实例。

&#13;
&#13;
var myApp = angular.module("myApp", []);

myApp.controller("myCtrl", function($scope) {
    $scope.getValue = function() {
      $scope.value = $scope.testDate23;
    }
  });
  
myApp.directive('buttonValue', function() {
    return {
      restrict: 'A',
      scope: {
       buttonValue:"="
      },
      link: function(scope, element, attr) {
        scope.$watch(function(){return attr.ngValue},function(newVal){
           scope.buttonValue = newVal;
        });
      }
    };
  });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp" ng-controller="myCtrl">
  <input ng-model="btnValue">
  <button ng-value="{{btnValue}}" ng-click="getValue()" button-value="testDate23">
    MON
  </button>
  <br>
  <pre>testDate23= {{testDate23}}</pre>
  <pre>value= {{value}}</pre>
</body>
&#13;
&#13;
&#13;

答案 4 :(得分:0)

如果要设置硬编码值,请使用ng-init

<button type="button"  ng-init="value=2"  class="btn btn-primary ole two" data-toggle="tooltip"  ng-click="addvalue()" 
ng-model="testDate23" value="MON"  id="buttonvalue" data-placement="top" data-original-title="this is a top tooltip">
  MON
</button>

您可以在同一模板中使用值。