Typescript と WinJS 用の Microsoft のマルチデバイス ハイブリッド アプリ テンプレートを使用して、単一ページ ナビゲーション アプリを作成しています。アプリは Win8、WP8、および Android 用にビルドされ、エミュレーターに問題なくデプロイされます。ただし、Win8 および WP8 アプリは、アプリの最初のページに正しく移動しません。Android は、同じコードを使用して問題なくナビゲートします。
WinJS にはナビゲーション状態保存機能がありますが、実際にはナビゲーション自体は行いません。Typescript/WinJS サンプルの Encyclopedia から実際のナビゲーション コードを借用しました。
失敗すると思われる関連部分を以下に示します。
args.detail.setPromise(
WinJS.Promise.timeout().then(function () {
if (oldElement.winControl && oldElement.winControl.unload) {
oldElement.winControl.unload();
}
return WinJS.UI.Pages.render(args.detail.location, newElement, args.detail.state, parented);
}).then((control) => {
this.element.appendChild(newElement);
this.element.removeChild(oldElement);
oldElement.innerText = "";
this.navigated();
parentedComplete();
})
);
render コマンドが戻った後、Android では、要素の innerHTML に、パス (args.detail.location) で指定されたページが含まれます。Win8 および WP8 では、要素はまだ空白です。
コードのこの部分は、ルート index.html ファイル内の WinJS 固有の html によってトリガーされます。
<div id="contenthost" data-win-control="TurnstileTS.PageControlNavigator" data-win-options="{home: './views/home/HomeView.html'}"></div>
このパスは Android で問題なく機能します。Ripple の Web ベースの Android エミュレータの絶対パスはhttp://localhost:4400/views/home/HomeView.html.
このパスは WP8 または Win8 では機能しませんが、例外もスローしません。画面は真っ白です。Win8 アプリのデバッグ実行中の絶対パスはms-appx://io.cordova.turnstile/www/views/home/HomeView.html.
何が問題なのかわかりません。WinJS の最新バージョンと、WinJS ビルドに含まれるタイピングを使用しています。
edit パズルのもう 1 つのピース: このサンプルでは、Cordova と WinJS を使用していますが、Typescript は使用していません。すべてがjavascriptです。独自のナビゲーター機能も備えています。これは、Win8 と WP8 で動作するようです。私が知る限り、WinJS ライブラリで同じ関数を呼び出しています。このサンプルと私がやろうとしていることの間に大きな違いは本当に見つかりません。
編集 #2 OK、javascript コンソールがエラーを吐き出し始めたことを発見した後、Win8 で実行すると次のメッセージが表示されます。
APPHOST9623: The app couldn’t resolve ms-appx://57059lmcpherson.turnstile/views/home/HomeView.css because of this error: RESOURCE_NOT_FOUND.
実際、これらのメッセージはたくさんあります。それで、何かが間違っています。
パスに開始スラッシュを使用することは Windows/Cordova アプリでは受け入れられないことについて何かを読んだので、それらを書き直そうとしました。javascript ファイルが html ファイルと同じサブディレクトリにある場合、パス参照はスラッシュを含まないファイル名にする必要があります。ただし、javascript コンソールは、これが Win8 で解釈され、www フォルダー (ビルド中に生成された) のルートを意味することを示しています。「/views/home/HomeView.css」を使用して実際のパスにハードコードしようとしても、まだファイルが見つかりません。javascript コンソールがスクリプトをヘッドにロードしようとしたことを示している場合、HTML ドキュメントの本文がロードされない理由は正確にはわかりません。