Resolving Sync Between Mddialog And Api Response In Angularjs

I am facing an issue while using mdDialog confirm from angularJS material design. I am using the confirm box to ask a user for his choice to continue or confirm, If the user confir

Solution 1:

I use something similar but it's ui instead of Material, anyway i believe it could give the clues to make it work.

app.controller('prioridade', function($scope, $filter, $uibModal) {
$scope.prioridades = response.data;
$scope.mymodal={};
$scope.openmymodal = function(msize, mtimeout, mbackdrop, mclass, mresponse){ /*this has some variables to make it dynamic*/$scope.mymodal.size = msize!=''?msize:'md';
    $scope.mymodal.timeout = mtimeout!=''?mtimeout:0;
    $scope.mymodal.backdrop = mbackdrop!=''?mbackdrop:true;
    $scope.mymodal.mclass = mclass!=''?mclass:'btn-success';
    $scope.mymodal.mresponse = mresponse!=''?mresponse:'no';/*aguardar por resposta yes or no*/var modalInstance = $uibModal.open({
        animation: true, ariaLabelledBy: 'modal-title', ariaDescribedBy: 'modal-body',
        templateUrl: 'myMainModal.html', controller: 'ModalInstanceCtrl', keyboard: true,
        controllerAs: '$ctrl', size: $scope.mymodal.size, backdrop: $scope.mymodal.backdrop,/*true or 'static'*/
        resolve: {mymodal: function(){return$scope.mymodal;}} /*to pass the variables to the modal*/
    });
    modalInstance.result.then(function(result) {
        $scope.myresult = result;
        if($scope.myresult.results=='OK'){
            /*do what ever you want*/
        } else { /*if canceled*/}
    });
};
/*here is where i call the modal function*/$scope.resetPSW = function(user) {
    $scope.mymodal.header='! Atenção está prestes a Apagar a Psw do User!';
    $scope.mymodal.body='<div class="col-md-12 col-sm-12 col-xs-12">** Tem a certeza que pretende apagar a Psw deste user? **</div>';
    $scope.mymodal.post=user; $scope.openmymodal('md', 1, true, 'btn-danger', 'yes');
};

 });
 app.controller('ModalInstanceCtrl', function ($uibModalInstance, mymodal, $timeout, $sce) {
var$ctrl = this; $ctrl.mymodal = mymodal; $ctrl.mymodal.body = $sce.trustAsHtml($ctrl.mymodal.body);
switch($ctrl.mymodal.timeout){
    case0, 1:
        $ctrl.ok = function(){$ctrl.mymodal['results'] = 'OK'; $uibModalInstance.close($ctrl.mymodal);}; 
        $ctrl.cancel = function(){$uibModalInstance.dismiss('cancel');};
        break;
    default:
        promise = $timeout(function(){$uibModalInstance.dismiss('cancel');}, 3000);
        $ctrl.ok = function(){$ctrl.mymodal['results'] = 'OK'; $timeout.cancel(promise); $uibModalInstance.close($ctrl.mymodal);};
        $ctrl.cancel = function(){$timeout.cancel(promise); $uibModalInstance.dismiss('cancel');};
        break;
};
 });

and the HTML

<script type="text/ng-template"id="myMainModal.html">
    <div class="modal-header" ng-class="$ctrl.mymodal.mclass">
        <h3 class="modal-title"id="modaltitle">{{$ctrl.mymodal.header}}</h3>
    </div>
    <div class="modal-body"id="modalbody" ng-bind-html="$ctrl.mymodal.body"></div>
    </br>
    <div class="modal-footer"id="modalfooter" ng-show="$ctrl.mymodal.timeout<=2">
        <button class="btn btn-primary"type="button" ng-click="$ctrl.ok()">OK</button>
        <button class="btn btn-warning"type="button" ng-click="$ctrl.cancel()" ng-show="$ctrl.mymodal.timeout==1">Cancel</button>
    </div>
</script>