First of all let's talk about the implementation, I'm using Angular in its version 1.6, and I'm starting to implement the use of the components. I am creating a single page aplication
and I am using components to divide the tasks. I also use auto-executable functions of javascript
to build the controllers.
I have the problem when I need to call a function in the component controller from the main controller. I know that bindings can be used to send parameters, but I do not know how to trigger a nested function from the main controller, since it is not aware of the functions of the component's controller.
Component configuration:
(function(angular,AppName){
var app = angular.module(AppName);
app.component("informacionInicialComponent", {
controller : "informacionInicialController",
bindings:{
ordenServicio : "=",
abrirStep : "="
},
templateUrl : "./rel/views/templates/informacion_inicial.html",
});
}(window.angular, window.AppName));
I know that the objects sent by the bindings can be called from the component controller using this
for this I implement a variable $scope.x = this
in the following way:
(function(angular, AppName){
var app = angular.module(AppName);
var controller = function($scope){
$scope.indexController = this;
$scope.funcionAllamar = function(){
console.log("ejecutando funcion desde controlador principal");
}
};
controller.$inject = ["$scope"];
app.controller("informacionInicialController", controller);
}(window.angular, window.AppName));
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.min.js"></script>
I want to call the function in this case called funcionALlamar from the main controller, but I do not know how to do it, and I heard something about using triggers
but I do not know how to implement them, I would appreciate any help what can you give me?