Angular 1.6: Open an uibmodal within another uibmodal using "resolve"?

Asked

Viewed 175 times

1

I’m having a problem opening an uibmodal within another uibmodal passing it through the resolve. I have two declared modals within the same controller, Modal1 and Modal2. Modal 1 passes modal2 in the resolve, everything works fine, except the question of "result.then", modal 2 returns a value x for a $scopo, but it returns the value for the main controller and I would like it to be returned to Modal1

Take the example: http://plnkr.co/edit/ltzJzn27413sQ17YThoX?p=preview

Does anyone know how to resolve this issue? I’ve tried using angular.copy but it doesn’t work :(

Thank you very much

  • Show what you’ve tried so far.

  • Hello Lucas, I put the code example in plnkr: http://plnkr.co/edit/ltzJzn27413sQ17YThoX?p=preview

1 answer

0


One option is to make the Open Modals function receive a callback:

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($scope, $uibModal) {

  //abre um Modal
  function openModal( templateUrl, controller, resolve, callback ){
    return $uibModal.open({
      templateUrl,
      controller,
      resolve
    }).result.then( callback || angular.noop );
  }

  //abre modal 1
  const openModal1 = (resolve, callback) => 
    openModal( 'modaltemplate1.html', 'ModalController1', resolve, callback);

  //abre modal 2
  const openModal2 = (resolve, callback) =>
    openModal( 'modaltemplate2.html', 'ModalController2', resolve, callback);


  $scope.produtos = 0;

  $scope.openModal1 = function () {
    openModal1({
      openModal2: function() {
        //envia a função de abrir o modal 2
        return openModal2;
      }
    });
  };

  $scope.openModal2 = () => openModal2({},  result => $scope.produtos = result);

});

angular.module('ui.bootstrap.demo').controller('ModalController1', function ($scope, $uibModalInstance, $uibModal, openModal2) {

  $scope.produtos = 1;

  $scope.ok = () => $uibModalInstance.close($scope.produtos);

  $scope.openModal2 = () => openModal2({}, result => $scope.produtos = result );

});

angular.module('ui.bootstrap.demo').controller('ModalController2', function ($scope, $uibModalInstance, $uibModal) {

  $scope.produtos = 2;

  $scope.ok = function () {
    $uibModalInstance.close($scope.produtos);
  };

});
  • Now how do I call modal2 inside my main controller? http://plnkr.co/edit/ltzJzn27413sQ17YThoX?p=preview

  • I updated it to make it easier.

  • Thank you very much! ;)

Browser other questions tagged

You are not signed in. Login or sign up in order to post.