Question

嘿伙计们，当我点击按钮时，我需要得到按钮的数据值。我试过这种方式，但它不起作用..

var app = angular.module('myApp', []);

app.controller("myAppCtrl", function($scope, $attrs) {
    $scope.events = {}
    $scope.events.btnLoadMore = function() {
        var panel = $attrs.emptywidget;
        alert(panel);
    }
});

HTML

<html ng-app="myApp">
<head>
  <title></title>
</head>

<body ng-controller="myAppCtrl">
  <button data-emptywidget="#panel2" ng-click="events.btnLoadMore()">Click</button>
</body>
</html>

Answer 1

您可以访问该数据属性的唯一方法是通过标准DOM访问，这在控制器内部是不明智的。您传入控制器的$attrs变量也不会给您太多，因为您的控制器与任何事物没有直接关系（或者至少它不需要或不应该）

如果您需要执行此类操作，则可以将ng-click更改为

ng-click="events.btnLoadMore('#panel2')"

然后更改btnLoadMore函数的定义以进行参数。或者，您可以编写一个指令，该指令将赋予该值，但这更复杂。但这取决于你真正想做什么。以上应该可以工作

Answer 2

您可以使用angular.element的组合并传入$ event源：http://jsfiddle.net/ahchurch/9USEv/1/

<div ng-controller="myAppCtrl">
    <button data-emptywidget="#panel2" ng-click="events.btnLoadMore($event)">Click</button>
</div>

var app = angular.module('myApp', []);

app.controller("myAppCtrl", function($scope, $attrs) {
    $scope.events = {}
    $scope.events.btnLoadMore = function($event) {
        console.log($event);
        var panel = angular.element($event.target).attr("data-emptywidget");
        console.log(panel);
    }
});

Answer 3

你可以做一些不同的事情。

1）您可以通过函数传递数据，如

ng-click="events.btnLoadMore('#panel2')"

然后更改您的功能以匹配：

$scope.events.btnLoadMore = function(panel) {
    alert(panel);
}

2）您可以通过$ event参数传递数据

ng-click="events.btnLoadMore($event)"

然后更改您的功能以匹配：

$scope.events.btnLoadMore = function(clickEvent) {
    alert(clickEvent.target.attributes['data-emptywidget'].value);
}

3）您可以查看传递给函数

的参数

$scope.events.btnLoadMore = function() {
    alert(arguments[0].target.attributes['data-emptywidget'].value);
}

如何获取点击属性值？

3 个答案: