Question

I'm doing one Ionic App and I'm trying to load some JS/CSS files but only if is iPad. Something like this:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title>Meeting App</title>


    <!-- compiled css output -->
    <link href="css/ionic.app.css" rel="stylesheet">

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/services.js"></script>

    // if ( is_ipad() ) : 
         <script src="css/just-ipad.css"></script>
         <script src="js/just-ipad.js"></script>
    // endif;
  </head>

  <body ng-app="starter">
    <ion-nav-bar class="bar-stable" align-title="center">
      <ion-nav-back-button>
      </ion-nav-back-button>
    </ion-nav-bar>

    <ion-nav-view></ion-nav-view>
  </body>
</html>

I think this could be do it in the index.html. There will be files used in all the iPad views but not in the mobile views.

I know that I can use the Platform Classes but this doesn't cover my needs. I'm very new in Ionic and I don't know if this is possible.

Any help is welcome!

Answer 1

动态添加OR加载文件

检查设备是否为ipad？

如果为true，则以这种方式添加所需文件（脚本或样式）。

If(ionic.Platform.isIPad()){
    var script = document.createElement("script");
    script.src = "https://maps.google.com/maps/api/js?&callback=loadGoogleMapsApiReady";
    document.getElementsByTagName("head")[0].appendChild(script);
}

问候。

Answer 2

I do believe you are looking for ionic.Platform.isIPad(); method as can be seen in the link provided.

Documentation

isIPad()

Returns: boolean Whether we are running on iPad.

Usage

It seems that they have some other helper functions as can be seen from the code snippet from their site below.

angular.module('PlatformApp', ['ionic'])
.controller('PlatformCtrl', function($scope) {

  ionic.Platform.ready(function(){
    // will execute when device is ready, or immediately if the device is already ready.
  });

  var deviceInformation = ionic.Platform.device();

  var isWebView = ionic.Platform.isWebView();
  var isIPad = ionic.Platform.isIPad();
  var isIOS = ionic.Platform.isIOS();
  var isAndroid = ionic.Platform.isAndroid();
  var isWindowsPhone = ionic.Platform.isWindowsPhone();

  var currentPlatform = ionic.Platform.platform();
  var currentPlatformVersion = ionic.Platform.version();

  ionic.Platform.exitApp(); // stops the app
});

ProTip

I simply Googled the following:

ionic check platform

and clicked the first link. In the future, consider using Google first.

Reading Material

ionic.Platform

Include JS files only on iPad (Ionic)

2 个答案: