Question

我有以下指令：

angular.module('havuraApp').directive('userCard', function () {
    'use strict';

    var controller = function ($scope) {

        $scope.clearCard = function (btn) {
            alert('clearCard was called');
        }
    }

    return {
        restrict: 'E',
        templateUrl: 'components/userCard/userCard.tpl.html',
        controller: controller,
        controllerAs: 'userCardController'
    };

我的模板，包含以下代码：

<button class="btn btn-simple" ng-click="userCardController.clearCard(this)">
                            <i class="fa fa-mail-forward"></i> Clear
                        </button>

我收到错误：未定义clearCard

Answer 1

你应该先调用它而不先引用你的控制器（userCardController.clearCard（）），因为函数在$ scope上，而不是＆＃39;这个＆＃39;

<button class="btn btn-simple" ng-click="clearCard()">
    <i class="fa fa-mail-forward"></i> Clear
</button>

Answer 2

您使用的是controllerAs语法，但之后您已在$scope上定义了点击处理程序。

当您使用controllerAs时，您可以在控制器对象本身而不是$scope上定义函数。

var controller = function ($scope) {
    this.clearCard = function (btn) {
        alert('clearCard was called');
    }
}

修改

或者，你可以做@Kevin F在评论中建议的答案。我之前没有注意到。关键是使用语法的controllerAs版本或不使用。如果您遵循他的建议，您还应该从指令中删除controllerAs。

指令ng-click不会调用控制器

2 个答案: