My directive controller function isn't being triggered on ng-click. Angularjs

Question

my directive controller $scope.closeSpinner function isn't being triggered when button ng-click="closeSpinner()" is clicked on the directive template.

AddUsers.Html

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

Directive

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'
    }
}]);

Template 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>

Probably the easiest way to help is if you create a Plunker or Fiddle as it isn't obvious from your samples what could be the problem. — camden_kid
– camden_kid, Commented Apr 18, 2015 at 19:27

Olivercodes · Accepted Answer · 2015-04-18 19:43:08Z

2

Based on the provided Plunkr, it seems to be working just fine. You should make sure your file paths are setup correctly to the template within the directive. Perform a test that it is being called with a console.log or $log.log call (as I have done in the plunk). Also, feel free to add the spinObject code to the provided Plunk.

answered Apr 18, 2015 at 19:43

Olivercodes

1,0486 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ray abu Over a year ago

Yeh, it works on mine also. I just had to clear the cache, and viola.. sorry for the post.

Collectives™ on Stack Overflow

My directive controller function isn't being triggered on ng-click. Angularjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related