My situation is a bit peculiar. I have a controller that I need to manage when a dialog opens. I am utilizing ngDialog along with templates and directives. Below is the code for DialogController:
(function() {
'use strict';
angular.module('Common').controller('DialogController', DialogController);
DialogController.$inject = ['$scope', 'ngDialog'];
function DialogController($scope, ngDialog) {
$scope.$on('openDialog', open);
function open(which) {
ngDialog.open({
template: which,
className: 'newproductdialog'
});
}
}
})();
Essentially, the purpose of this controller is solely to handle the opening, closing, and other functionalities of ngDialog.
Now, here is the approach I take to trigger the opening of the dialog (via vm.navigate invoked through ng-click) in HomeController:
function initNav() {
/**
* Array of navigation items.
* @type {{name: string, id: string, selected: boolean, icon: string}[]}
*/
vm.navs = [{
name: 'Home',
id: 'home',
selected: true,
icon: 'ss-home'
}, {
name: 'New',
id: 'create-new-product',
selected: false,
icon: 'ss-addfile'
}];
/**
* Color of the navigation elements.
* @type {string}
*/
vm.color = '#ea8daf';
/**
* Navigation function triggered upon clicking a nav item.
* @param item {object} The $scope.navs object that was clicked.
*/
vm.navigate = function(item) {
switch(item.id) {
case 'create-new-product':
----->$rootScope.$broadcast('openDialog', 'newproduct');
break;
}
};
}
Finally, here is the corresponding HTML for the above method:
<ft-nav items="homeCtrl.navs" onselect="homeCtrl.navigate" color="homeCtrl.color"></ft-nav>Despite my efforts, this approach does not seem to be effective. I am contemplating if the lack of associated HTML for DialogController is causing the issue. Could it be a problem with how I am using the broadcast event? While I am aware that employing a service and having DialogController watch the service is an option, I feel that utilizing $broadcast is a more preferable route. Any insights or suggestions would be greatly appreciated. Thank you!