我试图让我的webview隐藏，直到URL完成加载

Question

我有一个离子应用程序，加载到web视图的外部网站，我看到一个空白页面，每次加载web浏览器之前，url完成加载。我想只有在加载完成后才能显示webview。我也有一个loadstart的eventlistener，这意味着关闭窗口时，该网址被击中，并返回到离子应用程序的主屏幕，这在我的模拟器上工作，但在我的真实设备上它只是显示一个符号的空白页面。

$scope.login = function() 
     { 
     //check if network is connected before sending initial request 
     if(monitor.isOffline()) 
     { 
      var alertPopup = $ionicPopup.alert({ 
      title: 'Network Error!', 
      template: "Your Network is Offline, please connect and try again" 
      }); 
     } 

     //show spinner while loading page 
     $scope.show = function() { 
      $ionicLoading.show({ 
      template: '<p>Loading...</p><ion-spinner></ion-spinner>' 
      }); 
     }; 

     //hide spinner 
     $scope.hide = function(){ 
      $ionicLoading.hide(); 
     }; 


     //send initial request 
     AuthService.login($scope.user).then(
      function(home) 
      { 
      $scope.show($ionicLoading); 
      if(monitor.isOnline()) 
      { 
       $scope.show($ionicLoading); 

       var ref = window.open(home, '_blank', 'location=no,toolbar=no'); 

       ref.addEventListener('loadstart', function (event) 
       { 
       if(event.url == "http://mobile.map.education/logout") 
       { 
        ref.close(); 
       } 

       }); 
       ref.addEventListener('loaderror', function (event) 
       { 
       var alertPopup = $ionicPopup.alert({ 
        title: 'Network Error', 
        template: "Oops,Error with your network" 
       }); 

       ref.close(); 

       }); 

       $scope.hide($ionicLoading); 

       //watch network state 
       monitor.startWatching(); 
      } 
      if(monitor.isOffline()) 
      { 
       var alertPopup = $ionicPopup.alert({ 
       title: 'Network Error', 
       template: "Oops,Error with your network" 
       }) 
      } 
      }, 
      function (errMsg) 
      { 
      var alertPopup = $ionicPopup.alert({ 
       title: 'Login failed!', 
       template: errMsg 
      }); 
      }) 
      .catch(function() 
      { 
      var alertPopup = $ionicPopup.alert({ 
       title: 'Login failed!', 
       template: 'Server not responding' 
      }) 
       .finally(function ($ionicLoading) 
       { 
       $scope.hide($ionicLoading); 
       }); 
      }); 
     }; 

Answer 1

我觉得这个工作只与InAppBrowserPlugin但你可以hidden=yes

var ref = window.open(home, '_blank', 'location=no,toolbar=no,hidden=yes'); 

再在打开窗口：

ref.addEventListener('loadstop', function(){ 
    ref.show(); 
}); 

检查文档在这里：https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/