Как закрыть angular-ui модальный после нажатия кнопки, но при условии - PullRequest
0 голосов
/ 06 мая 2019

Я хотел бы закрыть модальный режим после нажатия кнопки «Сохранить», но только тогда, когда функция, которая также вызывается этой кнопкой, успешно разрешена.

parent.controller.js

.module('app.test')
.controller('TestController', function ($uibModal) {
    let vm = this
    vm.addTest = addTest
    vm.openAddTestModal = openAddTestModal


    function openAddTestModal() {
        var modalInstance = $uibModal.open({
          component: 'AddTestModalComponent',
          windowClass: 'test-modal',
        })
        modalInstance.result.then(function (result) {
            vm.addTest(result);
        });
    }

    function addTest(test) {
        //do something
        if (testCondition) {
            // do something 
               // success - close modal
         } else {
            // error - don't close modal
        }
    }
})

модальный.component.js

.component('AddTestModalComponent', {
    templateUrl: 'app/modals/add-test-modal.html',
    controllerAs: 'vm',
    controller: function ($modalInstance) {
        this.testToSave = [''];
        this.save = function (result) {
            $modalInstance.close(result); 
    //close only function called in parent resolve success
        };
    }
})

add-test-modal.html

<button class="btn btn-primary btn-blue" type="submit"
        ng-click="vm.save(vm.test)">
  Save
</button>

Возможно ли это так, или, может быть, я должен поделиться сферой и просто вызвать эту функцию из родителя области, а затемзакрыть при условии?

1 Ответ

0 голосов
/ 06 мая 2019

Существует два варианта, если допустить, что addTest возвращает обещание.

  1. Переместить логику addTest в сервис и вызвать этот метод из модального контроллера
  2. Передать функцию addTest в качестве параметра разрешения для модального,Пожалуйста, обратитесь https://angular -ui.github.io / bootstrap / #! Модальный

Родительский

function openAddTestModal() {
    var modalInstance = $uibModal.open({
        component: 'AddTestModalComponent',
        windowClass: 'test-modal',
        resolve: {
            addTest: addTest
        }
    })
    modalInstance.result.then(function (result) {
        vm.addTest(result);
    });
}

Модальный

controller: function ($modalInstance, addTest) {
    this.testToSave = [''];
    this.save = function (result) {
        addTest().then(function(){
            $modalInstance.close(result);
        })
    };
}

.

...