問題タブ [angular-ui-router-extras]

サブステートにリンクしようとしていますが、それを機能させる方法がわかりません。リンクは次のとおりです。

ルートは次のとおりです。

そして最終的に：

ビューの内容は次のとおりです。

localhost:8100/#/communitydashboard にもアクセスしようとしましたが、ホームにリダイレクトされるだけです。これを修正するにはどうすればよいですか。

この質問は、「状態を変更するときに兄弟の ui ビューを保持するにはどうすればよいですか」 ( plunker ) に基づいています。

メイン ナビゲーション (mainNav) の状態を変更するときに、ビュー (コンテンツ) を変更しないようにします。

コンテンツはサブ ナビゲーションでのみ設定し、メイン ナビゲーションを変更する場合はそのままにします。

状態のままでも、ui-router にビューが残る可能性はありますか?

別の状態に変更するときに Persist 状態を見つけましたが、問題が完全に解決するわけではありません。状態は永続的ですが、別の状態に移動するときにビューの一貫性を維持することは考慮されていません。

私はUIルーターの初心者です。すべての状態にグローバル パラメータを渡す必要があります。UIルーターにグローバルパラメータを設定する方法はありますか?

私はかなり複雑な AngularJS Web アプリケーションに取り組んでおり、私の要件を満たすモーダル/ルーティング メカニズムの実装に失敗し続けています。

状況

私のアプリケーションには（単純化された）次のエンティティがあります。

• 顧客 (連絡先が 0 件以上)
• 注文 (顧客は 1 人だけ)
• 連絡先 (正確に 1 人の顧客に属します)

新しい注文の作成中に、既存の顧客を選択するか、新しい顧客を作成できます。顧客の作成プロセスでは、必要に応じて新しい連絡先を作成できます。

UI / UX ソリューション

この機能を「整頓された」モバイル フレンドリーな方法で正しく表現する方法をいくつか検討しました。まず、モーダルやポップアップから完全に離れようとし、いくつかの Angular ディレクティブを作成してページに動的に表示しようとしましたが、すぐに複雑になりすぎました。新しい顧客の作成には、複数の UI 状態といくつかのサブ状態 (タブ) が存在し、かなり複雑なロジックが含まれています。

次に、個別のブラウザー タブを使用して、localStorage を使用してそれらの間で通信することを検討しました。しかし、このアプローチは壊れやすく、ユーザーにとってはあまり一般的ではないように思えました。さらに、ユーザーは作業が終了するまで新しいタブで作業を続け、それから前のタブに戻ることができるようにする必要があります。これは、別のブラウザー タブを使用して行うことはできません。

私は Javascript ブラウザーのポップアップを見てきましたが、その方向も好きではありません。

ユーザーの観点からは、モーダル ダイアログを使用して UI フローに従うのが最善の方法だと思います。

UIの流れ

注: 新規顧客と新規連絡先の状態は、通常のウィンドウで開くことができる状態でもあります。

Angular-UI-Router ルートを次のように作成しました。

• 新しい注文: app.orders.new
• 新規顧客: app.customers.new
• 新しい連絡先: app.contacts.new

発達

複数のモーダル アーキテクチャをサポートするために、いくつかのことを試しました。

1. Angular UI ブートストラップ モーダルの使用
2. 独自に構築されたモーダル ウィンドウを使用したUI-Router-Extras の方法の使用

留意すべきいくつかの重要な側面:

• モーダル ウィンドウを直接指す直接 URL は必要ありません。URL は「新規顧客」状態のままにすることができます。
• 動作はモーダルである必要があるため、親ウィンドウでは機能しません。
• 次々に複数の状態を開いて表示できる必要があります (たとえば、1 つのモーダルのウィザード)。
• 特定の順序で開いた複数のモーダルは、同じ順序で閉じる必要があります。（最初のうちの最後の）

1. Angular UI Bootstrap Modal の使用 この方法は有望に思えました。通常のルートのいくつかのコントローラーとビューを使用する別のルーティングを作成しました。

• Modal.Customers.New
• Modal.Contacts.New

しかし残念ながら、モーダル内でより多くのモーダルを開き、以前のモーダルの状態を維持するのに苦労しています。バックグラウンド状態を維持するために UI-Router-Extras Sticky States を使用しました。ただし、UI-Router-Extras の状態のように、Sticky States は、すべての状態に独自の ui-view がある場合にのみ機能します。事前に ui-view を宣言する必要があります。理論的には、ユーザーはアプリケーションでネストされたモーダルを無制限に開くことができるため、これは不可能です。

2.独自に構築されたモーダルウィンドウを使用してUI-Router-Extrasの方法を使用する

次のように UI-Router-Extras の単純なモーダルの例を使用して、Angular UI Modal の代わりに単純なモーダルを作成しようとしました: http://plnkr.co/edit/qgt0RkEnXDPDTdMJPIfy?p=info

しかし、残念ながら、オプション 1 と同じ問題があります。問題は、モーダルがネストされていると状態とルーティングが複雑になりすぎることです。

解決

私は今、最善のアプローチが何であるかについて本当に苦労しています。アプリケーションのコンテンツのみを表示する (メニューバーなどではない) Modal.Customers.New のような別の UI-Router ルートを開く iframe を含むモーダル オーバーレイ ウィンドウを表示することを考えています。

iframe を使用すると、親ウィンドウと iframe で別々のルートと州の情報を利用できるようになります。iframe を適切な形式にスケーリングするには、カスタム JavaScript を実行する必要がありますが、これは許容範囲です。

しかし、それでも「ハッキングされた」ソリューションのように感じます。

あなたの解決策と洞察を聞きたいです。

uiルーター使用時の動的ルートの作り方、

定義すると:

それはうまく動作します、

しかし、最初に動的 ID を追加してからページ名を追加しようとすると、エラーが発生します。

エラー：

この問題を解決するにはどうすればよいですか?

次のような状態がいくつかあります。

問題は、:practiceID変数が非常に長くなり、ユーザーフレンドリーではない可能性があることです。ユーザーが練習 ID に関連付けられたカスタム URL を作成できるようにしたいと考えています。たとえば、Facebook でプロファイルから始めるアカウントを作成する場合です。 URL は次のようになります: http://facebook.com/123456789ただし、http: //facebook.com/whateveryouwantに変更できます

したがって、基本的には次のようなことを達成したいと考えています。

ユーザーが設定できるようにすることはできましたが、そのunique urlようなルーティングの設定を開始する方法さえわかりませんか?

アプリへのログインに成功した後、ユーザーが利用できるすべての状態を から動的にロードしたいと考えていますapi/js。app.module動的にロードされる状態には、唯一の既知の状態であり、同じダウンロード内の他のすべての状態のルートである抽象的な状態が常に含まれます。

私の最初のアプローチは、ログイン後に oc.lazyLoad を使用することでした。正常に機能しましたが、ブラウザを更新すると機能しませんでした。次に、module.run で oc.lazyLoad を使用してロードしようとしましたが、機能しませんでした。

oc.lazyLoad を ui-router エクストラの futureState と一緒に使用しようとしましたが、動作させることができません。

$futureStateProvider私が望むことを行うことが可能である場合でも、構成方法について助けが必要です。

私の Angular JS アプリケーションには、2 つのビュー (v1 と v2) と 1 つのコントローラー (appCtrl) があります。

以下のようにUIルーターを構成しました

appCtrl には fv1 と fv2 という 2 つの関数があります。

ルート '/v1' が呼び出されたときに fv1 を実行し、ルート '/v2' が呼び出されたときに fv2 を実行したい。

誰かが提案できますか？