我試圖讓我的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/