I use mdDialog for creating new objects in my web application. Whenever I invoke mdDialog, it always invoke all methods which I have in my angular controller. How can i prevent it?
Here is a short example of my angular controller with mdDialog function
//whenever i click on button which invokes showCreateTask function
//these 3 methods get invoked also and send request to my api
$scope.timeline = new TimelineService();
$scope.users = UserService.getChatUsers();
$scope.projects = ProjectService.query();
/*********DIALOGS************/
$scope.hide = function () {
$mdDialog.hide();
};
$scope.cancel = function () {
$mdDialog.cancel();
};
$scope.answer = function (answer) {
$mdDialog.hide(answer);
};
$scope.createTask = function () {
TaskService.save($scope.task, function () {
});
}
$scope.showCreateTask = function (ev) {
$mdDialog.show({
controller: TaskController,
templateUrl: 'app/components/templates/CreateTaskDialog.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose: true,
fullscreen: false,
scope: $scope,
preserveScope: true,
onComplete: function () {
//Timepicker
angular.element(".timepicker").timepicker({
showMeridian: false,
showInputs: false,
minuteStep: 5,
defaultTime: '00:00'
});
}
})
.then(function () {
}, function () {
//fail
});
};
I found out that this controller: TaskController
cause my problem but I dont know how to solve it. If I remove controller from function, nothing will work.
So I solved this problem with creating nested controller especially for this mdDialog so it cant invoke anything else except what is in my new controller. As reference about nesting controller I used https://docs.angularjs.org/guide/controller