問題タブ [angular-universal]

そのため、最初にプロジェクト全体を Angular のユニバーサル (サーバー側レンダリング) なしで動作させ、次に Angular Universal スターター キットから始めて、プロジェクトを適切なディレクトリに移動しました。

特定のルートに移動するときにロードしてブートストラップする必要がある遅延ロードされたモジュールを除いて、すべてが機能するようになりました。webpack とユニバーサルを使用せずに動作しますが、使用しません。

メインモジュールのルートは次のとおりです。

何か案は？

Angular 2 を ng2-bootstrap と共に使用して作成し、Webpack と Universal を使用してサービスを提供している Web サイトは、Chrome では問題なく動作していますが、Safari や Microsoft Edge では動作しません。

現時点ではSafariが最も重要です。

開発者コンソールで、次のエラーが表示されます。

何かを割り当てようとしている読み取り専用プロパティを見つけることができないため、これはあまり役に立ちません。

詳細がわかり次第、ここに進捗状況を投稿します。

アップデート

最新の Angular 2 2.1.0 バージョンに更新しましたが、まだ運がありません。

また、誰かが「厳密な使用」を削除する別のプロジェクトを読みました。プロジェクトから、これは少なくともエラーなしでページをロードしました。しかし、リンクをクリックしようとすると、エラーが返されました。

アップデート

エラーの原因となっている実際の行を最終的に見つけました。

プロパティを設定する前に、プロパティが読み取り専用かどうかを判断する方法はありますか?

アップデート

1つのエラーが修正されたと思います。テンプレートのコンポーネントの 1 つで、読み取り専用のスタイル プロパティを割り当てていたことがわかりました。

そのため、代わりに<div [style]="getStyle()">TypeError<div [attr.style]="getStyle()">の発生を停止しました。

ただし、別のエラーが発生しました。

Angular の common/bundles/common.umd.js にあることがわかりましたが、Safari では定義されていません。何か案は？

Angular Universal がまだ開発中であることは知っています。そこで、外部 API サーバーから定期的に (Http サービス経由で約 10 秒ごとに) データを取得する Web アプリに Angular Universal を使用することを考えました。このデータは、Web アプリに表示されます。

簡単な解決策がまだ見つからないいくつかの問題に遭遇しました。

1. Angular Universal は明らかに、ページをプリレンダリングするために API サーバーからのデータを必要とします。Web アプリの HTML が要求されるたびに、nodeJS から API サーバーにクエリを実行したくありません。nodeJS サーバーが 1 つのクライアント Web アプリ インスタンスとまったく同じように "動作" し、10 秒ごとに API サーバーにクエリを実行し、このデータを 10 秒間隔で "キャッシュ" し、それを使用して HTML をレンダリングするだけで十分です。
2. クライアント Web アプリは、API サーバーからのデータをプライベート メンバー変数に格納します。このメンバー変数は、ngFor、バインディングなどで HTML を構築するために使用されます。しかし、このメンバー変数はもちろん最初は空/未定義です。Angular Universal (SEO ではなく、読み込み時間の短縮) のいくつかのアイデアが無効になるため、クライアント Web アプリが起動時に事前レンダリングされた HTML を消去することは望ましくありません。

ここで私が達成しようとしていることを理解していただければ幸いです。これにアプローチする方法を知っていますか、それとも「公式の」方法がありますか? そのようなことをしようとしているのは私だけではないと確信しています。

https://github.com/angular/universal-starter.gitのようにリポジトリを複製し、npm install を実行すると、依存関係が正常にダウンロードされました。ただし、npm start でプロジェクトを開始すると、次のエラーが発生しました。

エラーを解決するにはどうすればよいですか?