web-dev-qa-db-fra.com

modal angulaire ne se ferme pas ($ uibModal)

angular
.module('angProj')
.controller('UserCtrl',
    ['$scope', '$uibModal',
        function ($scope, $uibModal) {

            $scope.results = function (content, completed) {
                var modalInstance = $uibModal.open({
                        backdrop: 'static',
                        keyboard: false,
                        animation: $scope.animationsEnabled,
                        templateUrl: '/Scripts/angularApp/views/user-modal.html',
                        controller: 'UserModalCtrl',
                        resolve: {
                            items: function () {
                                return $scope.items;
                            }
                        }
                    });

                if (!completed || content.length === 0) {
                    return;
                }

        modalInstance.close();
        modalInstance.dismiss('cancel');

Je ne suis pas en mesure de fermer le modèle lorsque l'utilisateur a terminé. Sur modal, je montre une barre de progression. Le code fonctionne correctement sans erreur, mais le modal reste ouvert. J'ai aussi essayé $ uibModalInstance mais le contrôleur génère une erreur: fournisseur inconnu (impossible d'injecter $ uibModalInstance sur le même UserCtrl) J'injecte ui.bootstrap (ui-bootstrap-tpls-1.1.2.js)

Merci pour votre temps.

5
Scorpio

Utilisez modalInstance.close() dans votre contrôleur UserModalCtrl

app.controller('UserModalCtrl', ['$scope', '$modalInstance' function($scope ,modalInstance {
  $scope.close = function () {
   modalInstance.close();
  };
}]);
5
Rock

J'ai fait quelque chose de similaire, je pense.

J'ai un contrôleur $modal qui ressemble à ceci

angular.module('myApp').controller('infoCtrl', function ($scope, $uibModalInstance, loading) {

  $scope.editable = loading;

  $scope.$watch('editable.status', function(newValue, oldValue) {
    if (newValue == 'success'){
        // close modal
        $uibModalInstance.close('ok');
    } else if (newValue == 'error') {
        // show error message
    } 
  });
});

La loading injectée est un service qui ressemble à ceci

myApp.factory('loading', function() {
  return {
    status: ''
  }
});

Et lorsque je change le statut de mon service de chargement en "succès" (de n'importe où, pas du contrôleur modal), le modal est fermé.

Je ne sais pas si c'est exactement ce que vous demandiez, mais j'espère que cela vous aidera, demandez-lui aussi si quelque chose n'est pas clair! 

EDIT: Supposons donc que vous avez un service avec une valeur isCompleted: false, injectez ce service dans votre contrôleur modal et utilisez la fonction $watch; ensuite, lorsque cette isCompleted devient true, vous fermez le modal.

0
klskl