AngularJS - 为什么没有触发ng-click处理程序?

Nar*_*esh 2 angularjs angularjs-directive angularjs-ng-click

这是HTML:

    <tr data-ng-repeat="a in assignments" data-ng-click="vm.handleAssignmentClicked()">
        ...
    </tr>
Run Code Online (Sandbox Code Playgroud)

以下是关联的指令和控制器:

angular
    .module('app.assignments')
    .directive('stfrAssignments', assignmentsDirective)
    .controller('AssignmentsController', AssignmentsController);

function assignmentsDirective() {
    var directive = {
        restrict: 'E',
        templateUrl: 'components/assignments/assignments.html',
        scope: {
            assignments: '='
        },
        controller: 'AssignmentsController',
        controllerAs: 'vm'
    };
    return directive;
}

function AssignmentsController() {
    var vm = this;

    function handleAssignmentClicked() {
        console.log('handleAssignmentClicked');
    }
}
Run Code Online (Sandbox Code Playgroud)

当我单击一个赋值(表中的一行)时,该handleAssignmentClicked()函数未被调用.我应该在哪里寻找问题?

flo*_*bon 5

更新:正如注释所指出的那样,父指令(我们假设正在使用它)使用的controllerAs语法在第二点[2]中解决.我留下第一个供参考.

[1] 除非使用语法,否则this控制器中的关键字与其不同.$scopecontoller as controllerName

你可以注入$scope你的控制器:

function AssignmentsController($scope) {
  $scope.handleAssignmentClicked() {
    console.log('handleAssignmentClicked');
  }
}
Run Code Online (Sandbox Code Playgroud)

[2]或者,您的情况如何:

<div ng-controller="AssignmentsController as assignCtrl">
...
  <tr data-ng-repeat="a in assignCtrl.assignments" data-ng-click="assignCtrl.handleAssignmentClicked()">
Run Code Online (Sandbox Code Playgroud)

在您的控制器中,您将使用this该功能可访问:

this.handleAssignmentClicked = function() { ... }
Run Code Online (Sandbox Code Playgroud)