1

I am trying to import the contents (import the reference of the CSS and JavaScript files) of a particular html page, named "helper.html" to another html page,named "navigation.html". It works on the emulator (the reference of the CSS and JavaScript files of the "helper.html" can be imported) but NOT on the device (the device I am using is Android tablet).

My project directory looks like this:

www

-templates

  • navigation.html (inside templates folder)

-helper.html (inside www)

In my "navigation.html", I have the following code snippet:

<!DOCTYPE html>
<html>
<head>
<link rel="import" href="helper.html">
</head>
<body>
 <ion-view view-title="Navigation">
    <ion-content>
  // SOME CODES
 </ion-content>
    </ion-view>

 </body>
 </html>

In my "helper.html", I have the following code snippet:

<!DOCTYPE html>
<html>
<head>
 <title></title>
<link rel="stylesheet" href="css/pathFindingstyle.css" />
  <!-- Some JS files to be loaded, but I am not posting them here-->
 </head>
<body >
 <div id="draw_area"></div>
 <div id="stats"></div>
</body>
</html>

Can someone tell me a way how I could make this work on the android device? Thanks!

4

1 回答 1

1

适用于 Android 的旧版本 Cordova (<= 4.4.4) 不使用 Blink、Chromium / Chrome 网络引擎，或使用不实现 Web 组件的旧版本 Blink (< 36) - 包括 HTML 导入 - HTML 渲染。

因此，您需要将 Android 升级到版本 5+，或者使用更新的设备来获得本机实现。

作为一种解决方法，您可以尝试使用webcomponentsjs polyfill以及模拟 HTML 导入的HTMLImports.js文件（尽管我不知道它是否适用于您的 Android 版本）。

于 2017-01-10T02:42:40.587 回答