閃屏后的離子白屏

Question

我寫了一個腳本來檢測是否有wifi連接。 但是，我注意到，如果在沒有wifi連接的情況下啟動應用程序，則將啟動啟動屏幕，然后出現白屏。 控制台顯示此錯誤：

無法加載資源：net :: ERR_INTERNET_DISCONNECTED

這是我檢測wifi並將其放置在$ ionicPlatform.ready中的腳本：

$rootScope.$on('$cordovaNetwork:offline', function(event, networkState)
    {
      connectionerror($ionicPopup)
    })

    //display error msg and close the app.
    function connectionerror($ionicPopup,$scope)
    {
      var myPopup = $ionicPopup.show({ 
        title: 'Network Error',
        content: 'No internet connectivity detected. Please try again.',
        buttons: [
        {
          text: '<b>Retry</b>',
          type: 'button-positive',
          onTap: function(e) 
          {
            if (!$cordovaNetwork.isOnline()) 
            {
              e.preventDefault();  
            }
            else 
            {
              $state.reload();
            }
          }
        }]
      });
    } 

我如何解決它，以便在啟動屏幕之后，如果沒有wifi，則會顯示該消息？

Answer 1

當您嘗試從PC加載資源時，會發生該錯誤。 如果您正在運行離子服務或實時運行離子服務，並且斷開了wifi的連接，則該應用將嘗試使用wifi從您的PC上加載模板，並且將無法執行此操作。

要測試該腳本，您應該構建該應用程序並在設備上運行它。

如果這有效，則控制器應該以不同的方式工作。 它看起來應該像這樣：

.controller('controller', function($scope, $rootScope, $state, $ionicPopup, $cordovaNetwork){
    $rootScope.$on('$cordovaNetwork:offline', function(event, networkState)
      {
        connectionerror()
      })

    //display error msg and close the app.
    function connectionerror()
    {
      var myPopup = $ionicPopup.show({ 
        title: 'Network Error',
        content: 'No internet connectivity detected. Please try again.',
        buttons: [
        {
          text: '<b>Retry</b>',
          type: 'button-positive',
          onTap: function(e) 
          {
            if (!$cordovaNetwork.isOnline()) 
            {
              e.preventDefault();  
            }
            else 
            {
              //go to a state like index or home instead of reload. Reload resets the application and should be avioded in single page apps
              $state.go('...'); 
            }
          }
        }]
      });
    } 
})