How to call function from directive in controller? AngularJS

Question

How in controller can I call function clearCopy from directive?

This is part of my html:

<tr ng-form="mForm" my-directive>
  <td>
    <div>
      <button class="btn btn-default" ng-click="saveData(row)"> </button>
    </div>
  </td>
</tr>

This is my Directive:

angular.module("w.forms").directive("myDirective", function () {
    return {
        require: ["^form"],
        link: function (scope, element, attrs, ctrls) {
            scope.$watch(function () {
            // ...... something
            }, true);

            scope.clearCopy = function () {
                // do something
            }
        }
    };
});

This is my Controller:

angular.module("app").controller("datalesController", function ($scope) {
  $scope.saveData(row) = function {
     // do something then run function from directive
     // till this part everything works fine
    $scope.clearCopy()   // unfortunately it doesn't work :(
  }
}

Everything works fine, except function $scope.clearCopy() in controller doesn't work.

http://stackoverflow.com/questions/16881478/how-to-call-a-method-defined-in-an-angularjs-directive may shed some light. — Jason, Nov 26 '16 at 16:29

score -2 · Answer 1 · answered Nov 26 '16 at 18:04

HTML

<html>
<script src="library/angular.min.js"></script>
<script src="practice.js"></script>
<head>
</head>
<body ng-app="app" ng-controller="datalesController">
    <div my-directive>
      <button ng-click="saveData()">press </button>
    </div>
</body>
</html>

controller

angular.module('app',[]).controller("datalesController", function ($scope) {
  $scope.saveData = function() {
     // do something then run function from directive
     // till this part everything works fine
    $scope.clearCopy(); // unfortunately it doesn't work :(
  };
});

Directive

angular.module('app',[]).directive("myDirective" , function () {
    return {
        restrict:'A',
        link: function (scope, element, attrs, ctrls) { 
           scope.clearCopy = function () {
                console.log("calling from controller");
            };
        }
    };
});

I change your code for running your request

I changed module because exists different module, "w.forms" and "app". in additional to you do not specified restrict:'A' in your directive and saveData function has been defined incorrectly. — shahab, Nov 27 '16 at 07:22

How to call function from directive in controller? AngularJS

1 Answers1