Как вернуть значения из модальной службы angular - PullRequest
1 голос
/ 05 марта 2020

Angular. js проблема с модальной областью и областью контроллера

Мое текущее приложение Angular 1.x работает следующим образом - у меня есть tempplate, давайте назовем его 'view', который вызывает функцию на ng -click, пример кнопки:

<div ng-controller="viewController as listing">
     <button ng-click="listing.openModal()" ng-disabled="listing.isButtonDisabled">
</div>
$scope.isButtonDisabled = false;
$scope.openModal = ModalService();

Контроллер для представления использует фабрику, которая открывает модал, я использую фабрику, так как несколько контроллеров используют одну и ту же модальную функциональность. Как видно из вышеизложенного, я не отключаю кнопку изначально.

Модал открывается, и у него есть свой собственный контроллер, который связан с вводом, полученным от пользователя в модале. Когда ввод был обработан, в случае успеха я хочу отключить кнопку в исходном представлении, которая открывает модальное окно.

Проблема, как я вижу, заключается в том, что я не в поле зрения моего нового контроллера - если я сделать это:

$scope.isButtonDisabled = true;

Это будет применяться к области действия модального вида, а не к исходному виду, который требует открытия модального окна?

ОБНОВЛЕНИЕ

Я использую этот angular модальный сервис:

Angular Модальный сервис

Я создал этот Plunker для демонстрации своего кода:

рабочий плункер

1 Ответ

1 голос
/ 06 марта 2020

Из DOC:

Вызов showModal возвращает обещание, которое разрешается, когда создается модальный элемент DOM и создается контроллер для него. Обещание возвращает объект modal, который содержит созданный элемент, контроллер, область действия и два обещания: close и closed. И то и другое разрешается до результата модальной функции close, но close разрешается, как только вызывается модальная функция close, тогда как closed разрешается только после того, как модал завершил анимацию и был полностью удален. из DOM.

- GitHub: angular README -modal-service - Использование

Служба должна вернуть обещание:

app.service('FooBar', function FooBar(ModalService) {

    this.openModal = function(template, controller) {

        // Note: in order to fire the modal pop-up the id of the script tag 
        //of the modal should match the first param of ng-click on the button
        // eg. <script type="text/ng-template" id="messageSeller">
        // should match: ng-click="openModal('messageSeller',
        //                         'messagesAddController')"

        //IMPORTANT return promise
        ̶M̶o̶d̶a̶l̶S̶e̶r̶v̶i̶c̶e̶.̶s̶h̶o̶w̶M̶o̶d̶a̶l̶(̶{̶
        return ModalService.showModal({
            templateUrl: template, // <- ensure the value of template
                                   // matches the id of one of the modal divs     
            controller: controller,
            inputs: {}
        })
    };
})

Используйте возвращенное обещание в контроллере:

app.controller('Controller', function(FooBar) {

    var listing = this;
    listing.isButtonDisabled = false;

    listing.openModal = function(template, controller){
        FooBar(template, controller)
          .then(function(model) {
            return modal.close;
        }).then(function(value) {
            console.log(value);
            listing.isButtonDisabled = true;
        }).catch(function(reason) {
            console.log("Modal error:", reason);
        });                
    }
});

Отключите кнопку, когда модальное значение успешно возвращает значение.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...