Question

我遇到了一个问题，使用$ uibModal并在父窗口的解析中打开另一个模态窗口，特别是当我使用setTimeout延迟打开时，看起来内部窗口在外窗口解析之前不会打开它在决心论证中的所有承诺。

工作和非工作示例之间的唯一区别是使用setTimeout来延迟内部弹出窗口的打开。

失败示例 - 使用setTimeout

$scope.doesntWork = function(){
    $uibModal.open({
      templateUrl : 'popup.html',
      resolve : {

        test : function(){
          var q = $q.defer();

          //This inner poppup wont show until the outer one is also
          //allowed to show (Resolve is resolved)
          setTimeout(function(){
            $uibModal.open({
              templateUrl : 'popup_inner.html' 
            });
          },1);

          setTimeout(function(){
            q.resolve(5);

          },2000);
          return q.promise;
        }
      }

    });  
  };

工作示例 - 没有setTimeout

  $scope.works = function(){
    $uibModal.open({
      templateUrl : 'popup.html',
      resolve : {

        test : function(){
          var q = $q.defer();
           $uibModal.open({
              templateUrl : 'popup_inner.html' 
            });

          setTimeout(function(){
            q.resolve(5);

          },2000);
          return q.promise;
        }
      }

    });  
  };

我不确定为什么会这样，因为没有依赖外部弹出窗口为内部弹出窗口打开。

请参阅plunkr：here

更新

有趣的是，即使你在尝试使用resolve参数打开另一个之前设置了一个模态 - 它将不会显示，直到第二个模态上的解析完成，即使与第一个模态没有关系 - 不是我知道的真实场景但我很想知道原因。

$scope.doesntWork = function(){

    $timeout(function(){
        $uibModal.open({
          templateUrl : 'popup_inner.html' 
        });
    },1);

    //unrelated to the above modal yet blocks it from showing until  
    //resolved finished

    $uibModal.open({
      templateUrl : 'popup.html',
      resolve : {

        test : function(){
          var q = $q.defer();
          setTimeout(function(){
            q.resolve(5);

          },2000);
          return q.promise;
        }
      }

    });  
  };

Answer 1

我认为解决方案是在超时时间内调用$ scope。$ apply。

e.g。

adb disconnect

在plunk上测试并且工作正常。

在父解析中使用setTimeout打开子模态

1 个答案: