[pass function as parameter to component in anglularjs] #angularjs

componentCtrl.js

// ...

export class ComponentCtrl {
  // ...
  onClick() {
    // We can access outer scope function here with the binding name.
    this.outerHandleClick({param1: 1, param2: 2}) // We can also pass parameters to outer function.
  }
}

example.component.html

<button ng-click="ctrl.onClick()">hello</button>

example.component.js

import { coreModule } from "app/core/core";
import { ComponentCtrl } from "...";

coreModule.component("MyComponent", {
  templateUrl: "example.component.html",
  controller: ComponentCtrl,
  controllerAs: "ctrl",
  bindings: {
    outerHandleClick: "&",  // bind function
  },
});

outer.html

<my-component outerHandleClick="ctrl.someFunction(param1, param2)"></my-component>

outerCtrl.js

// ... this is the outer controller
someFunction(param1, param2) {
  console.log(param1, param2); 
}