从聚合物路由Express并不适用于phonegap

时间:2015-05-11 13:35:13

标签: android cordova polymer

我在phonegap中编译应用程序后遇到polymer pushstate routing问题。 我尝试使用This github page中的app-router-examples

当我使用apache cordova编译我的应用程序时,我的android设备上只有空白屏幕。

我的index.html页面中的代码是我的主路由器页面。 我的所有页面都在/pages目录

    <!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
    <title>Project</title>
    <script src="bower_components/webcomponentsjs/webcomponents.js"></script>
    <link rel="stylesheet" href="assets/css/styles.css" shim-shadowdom>
    <link rel="import" href="bower_components/app-router/app-router.html">
    <link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
    <link rel="import" href="bower_components/font-awesome-polymer-icons/fa-icons.html">
    <link rel="import" href="bower_components/font-roboto/roboto.html">
    <link rel="import" href="bower_components/core-toolbar/core-toolbar.html">
    <link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
    <link rel="import" href="bower_components/core-icons/core-icons.html">
</head>
<body fullbleed>

<app-router>
    <app-route path="/" import="/pages/home-page.html"></app-route>
    <app-route path="/login" import="/pages/login-page.html"></app-route>
    <app-route path="/main-page" import="/pages/main-page.html"></app-route>
    <app-route path="/password-remind" import="/pages/password-remind-page.html"></app-route>
    <app-route path="/password-remind-info" import="/pages/password-remind-info-page.html"></app-route>
    <app-route path="/report-step-one" import="/pages/raport-step-one-page.html"></app-route>
    <app-route path="/report-structure" import="/pages/structure-page.html"></app-route>
    <app-route path="/report-progress" import="/pages/progress-page.html"></app-route>
    <app-route path="/contact-page" import="/pages/contact-list.html"></app-route>
    <app-route path="*" import="/pages/not-found-page.html"></app-route>
</app-router>
</body>
</html>

我的配置xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.cordova.hellocordova" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>App</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="dev@cordova.apache.org" href="http://cordova.io">
        Apache Cordova Team
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-whitelist" version="1" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
</widget>

我的申请结构:

App-structure screenshot

1 个答案:

答案 0 :(得分:0)

从本地文件系统加载Web组件时,

link rel="import"不起作用(例如,使用file:// schema)。尝试vulcanize应用程序,以便将Web组件捆绑到index.html中。