问题
I need to pass button id in Ionic Framework.
Here is what I have tried.
In js code:
angular.module('todo', ['ionic'])
.controller('TodoCtrl', function($scope) {
{
$scope.showAlert = function(btnId) {
alert(btnId);
};
}
});
In html:
<button id="a" class="button button-light" data="{{button.id}}" ng-click="showAlert(data.id)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" data="{{button.id}}" ng-click="showAlert(data)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" data="{{event.id}}" ng-click="showAlert(data.id)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" ng-click="showAlert(this.id)">
Click Me
</button>
O/P: undefined
or
<button id="btnId" class="button button-light" ng-click="showAlert('btnId')">
Click Me
</button>
O/P: btnId
Is this correct way to directly write id of button in function?
I referred to a few answers like this. So I think I am making some mistake in using it. Please let me know what I need to change.
回答1:
Yo, check this gist:
https://gist.github.com/lc-nyovchev/ed0a640a82a0f2dfd5a1
That is a very easy and naive way to do it.
<div data-ng-init="btnId='asd';">
<button data-ng-attr-id="btnId" class="button button-light" data-ng-click="showAlert(btnId)">
Click Me
</button>
</div>
Or you can have in your controller:
$scope.btnId = 'asd';
Then you don't need the ng-init block div.
Or you can get a handle to the $event in your ng-click, and get its target, and then get its id, but I wouldn't recommend that, it is not the angular way of doing things:
<button id="bla" class="button button-light" data-ng-click="showAlert($event)">
Click Me
</button>
$scope.showAlert = function(event){
alert(event.target.id);
}
回答2:
This works if no repeaters are there , if repeaters are the data attribute should have different names and secondly event.CurrentTarget.Id will make it work.
来源:https://stackoverflow.com/questions/22630342/pass-button-id-in-ng-click-angular-js