In order to keep the ngDialogs centralized in one place instead of dispersed, I had the idea of creating a factory named modal.js. This factory would contain a list of all the modals with a switch statement. Here is an example:
.factory('Modal', [function() {
var modal = {};
return {
get: function(option) {
switch(option) {
case 'modal1':
modal = {
template: 'modal1.php',
controller: 'modalController',
resolve: {
$dep: function() {
return 'dep';
},
dip: function() {
return 'dup'
}
}
};
break;
case 'modal2':
modal = {
template: 'modal2.php',
controller: 'modalController2',
resolve: {
$dep2: function() {
return item.dep2;
},
dip2: function() {
return item.dip2;
}
}
};
break;
}
return modal;
}
}
}]);
My plan was to then call this factory through a directive, let's name it open-modal.js.
.directive("openModal", ['ngDialog', 'Modal', function(ngDialog, Modal) {
return {
restrict: "A",
link: function(scope, elem, attrs) {
return elem.bind('click', function() {
var modal = Modal.get(attrs.modalName) // Modal.get('modal1');
ngDialog.open(modal);
});
}
};
}]);
The issue I'm facing is mainly with modal2
. I can't retrieve the item from the resolve because it's not part of the controller. My question is: Is there a workaround to maintain this structure?
Thank you for your assistance!