When passing a value to my mdDialog controller for editing content in a modal, I'm facing an issue where if the user cancels the modal, no adjustments can be saved. However, if changes are made within the modal, they are reflected on the list in the parent view. Surprisingly, when canceling the modal, the changes made are not undone. The bindToController option is set to true, indicating that a copy should be passed instead of a reference.
vm.editFaq = function (faqToEdit, ev){
var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && vm.customFullscreen;
$mdDialog.show({
controller: 'editFaqController'
, controllerAs: 'dvm'
, templateUrl: './app/components/faq/modals/editFaq.html'
, parent: angular.element(document.body)
, targetEvent: ev
, clickOutsideToClose: true
, fullscreen: useFullScreen
, locals: { faq : faqToEdit }
, bindToController: true
}).then(function(result){
if(result){
_.findWhere(vm.allFaqs, { _id: faqToEdit._id }) = result;
}
});
$scope.$watch(function () {
return $mdMedia('xs') || $mdMedia('sm');
}, function (wantsFullScreen) {
$scope.customFullscreen = (wantsFullScreen === true);
});
};
After hiding the modal, the "then" promise is triggered and the adjustments can be committed successfully.