Within the fileA.directive.html file, I have the following HTML template:
<md-button ng-click="resetForm()" class="btn btn-primary">Reset form</md-button>
<user-form reset-user-fn=""></user-form>
In my fileA.directive.js, the code looks like this:
app.directive("shopAppFormCustomer", function() {
return {
restrict: "E",
replace: true,
templateUrl: "fileA.directive.html",
scope: {},
controller: [
"$scope",
function($scope) {
$scope.resetForm = function () {
// want to call reset-user-fn here
}
}
]
};
})
The fileB.directive.js contains the directive userForm:
app.directive("userForm", function() {
return {
restrict: "E",
replace: true,
templateUrl: "fileB.directive.html",
scope: {resetUserFn: "=" },
controller: [
"$scope",
function ($scope) {
$scope.resetUserFn = function () {
// reset goes here
}
}
]
}
My query is as follows:
How can I invoke the attribute resetUserFn from the fileB.directive.js in the fileA.directive.js?
Please provide any relevant sources or documentation.
Note: It would be preferable not to use custom events if possible.