how to pass the value of a button to angular js
Question
I wanted to pass my button value to angular js through a function. I tried passing the function with the ng-model but it's not working in the case of a button. So can anyone help me with this thanks in advance
html:
<p align="center">
<a href="#category1" id="select1" ng-model="select1" data-transition="slidedown" class="ui-btn ui-corner-all" value="Category 1" ng-click="catFn1()">Category 1</a>
</p>
angular js:
$scope.catFn1 = function () {
var sel1 = document.getElementById('select1').innerHTML;
alert(sel1);
sharedService.prepForBroadcast(sel1); //----- making the button value available through out the code
return dict1(sel1);
}
function dict1(sel1) {
alert(sel1);
$("#dictation1").click(function () {
window.location = "#pageeight";
});
}
I actually wanted to perform controller communication using factory method I just know to communicate by this method. So I need to pass my value through a function.All the answers are valued.
3 answers
solution1
2 ACCPTED 2014-10-13 09:30:10
You can access current object via e.target property. From there you can grab value attribute.
<a href="#category1" ng-click="catFn1($event)" data-value="Category 1" data-transition="slidedown" class="ui-btn ui-corner-all">Category 1</a>
In controller:
$scope.catFn1 = function (e) {
var sel1 = e.target.getAttribute('data-value');
sharedService.prepForBroadcast(sel1);
return dict1(sel1);
}
solution2
1 2014-10-13 11:45:53
plnkr = http://plnkr.co/edit/b1bFqZdoGVNyC5KOCkJp?p=preview
ng-click's value is an expression, see below:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
</head>
<body ng-app>
<p align="center">
<a href="#category1"
id="select1"
ng-model="select1"
data-transition="slidedown"
class="ui-btn ui-corner-all"
value="Category 1"
ng-click="catFn1();select1 = $event.target.attributes.getNamedItem('value').textContent">
Category 1
</a>
select1 = {{ select1 }}
</p>
</body>
</html>
solution3
0 2014-10-13 09:30:49
First, its not a button its an anchor.
Try this:
<a href="url" onclick="test(this)">Text</a>
function test(control){
alert(control.innerHTML)
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.