Question

在指令模板上单击按钮$scope.closeSpinner时，我的指令控制器ng-click="closeSpinner()"功能未被触发。

AddUsers.Html

<div spinner spinneron="playerSearchSpinnerOn"> </div>

指令

monopolyMenuModule.directive('spinner', ['spinObj', function (spinObj) {
    return {

        restrict: "A",
        scope:{
            spinneron: "="
        },
        link: function ($scope, elem, attr) {
            $scope.$watch('spinneron', function (newValue, oldValue) {
                if (newValue != oldValue) {
                    if (newValue) {
                        // load spinner, create a model dialog, with a cancel button.
                        var spinner = spinObj.spin();
                        var element = angular.element(".modal-content");
                        element.append(spinner.el);
                        $("#spinnerDialog").modal('show')
                    }
                    else if (newValue == false) {
                        // close spinner called.
                        spinObj(false);
                    }
                }
            });

        },
        controller: function($scope)
        {
            $scope.closeSpinner = function () {
                $scope.spinneron = false;
            }
        },
        templateUrl: '/Js/MonopolyMenu/model.html'
    }
}]);

模板Html

<div class="modal fade" id="spinnerDialog" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-footer">
            <button class="btn btn-success" data-dismiss="modal" ng-click="closeSpinner()">Cancel</button>
        </div>
    </div>
</div>

Answer 1

基于提供的Plunkr，它似乎工作得很好。您应确保将文件路径正确设置到指令中的模板。使用console.log或$ log.log调用执行测试（正如我在plunk中所做的那样）。另外，随意将spinObject代码添加到提供的Plunk。

我的指令控制器功能没有在ng-click上触发。 Angularjs

1 个答案: