問題タブ [angular-ui-router-extras]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angularjs - デフォルトの ui-router 状態を削除すると、ネストされた状態が AngularJS でアクティブになります
これはおそらく簡単な答えですが、頭を悩ませています。Angular ダッシュボードを作成しています。ログインすると、ユーザーは /dashboard を参照できます。ダッシュボードを閲覧するためのネストされた状態もあります。以下は私の状態がどのように設定されているかです(簡潔にするために短縮されています)
app.js
ダッシュボード.html
この質問とは関係ありませんが、page-header と dashboard-menu 用に 2 つのディレクティブを作成しました (これが何であるか疑問に思った場合に備えて)。
ブラウザ ビュー: (ヘッダー全体の別のスクリーンショットを追加するために編集)
私が知りたいのは、アクティブな状態がアクティブになったときです。この例では、dashboard/new の /dashboard ページのデフォルト コンテンツが表示されません。
ご覧いただきありがとうございます。質問しようとしていたことがわかっているので、何でも聞いてください。混乱することなく質問できたことを願っています。ありがとうございました。
angularjs - $stateProvider.state().state(); の違い および $stateProvider.state(); $stateProvider.state();
$stateProvider の状態メソッドについて混乱しています。
違いは何ですか:
また
angularjs - UI Router sticky onReactivate refresh listview
モバイル スパ アプリの詳細ページから戻ったときにリストビューのスクロール位置を維持するためにスティッキー状態を使用できるように、エクストラで angular と ui-router を使用しています。
私のリストは剣道携帯のリストビューです。私はcrudを実装しており、戻るときにリストビューで行われた変更を反映したいと考えています。戻るボタンで $state.go を使用しませんが、戻るボタンを「期待どおりに」機能させたいので $window.history.back を使用します。そのため、その関数のリロード パラメータを使用できません。
onReactivate を配線し、フラグを持つサービスを挿入して、crud 操作が行われたかどうかを通知し、リストをリロードします。これはすべて機能し、画面をリロードする必要があるかどうかをうまく判断できます。
そこで、kendo.mobile.ui.ListView の更新メソッドを使用してみます。angular.element("#idoflistview").data("kendoMobileListView").refresh() を使用します。それを見つけて更新しますが、すべての項目が style="transform: translate3d(0px, 0px, 0px);" を持つように設定されているため、すべて互いに重なり合っています。
私はもともと $state.reload() を実行してページを再構築しようとしましたが、コントローラーで init 関数を呼び出すという点で機能し、フラグを使用してデータを正しい方法で要求することを知ることができましたが、リストビューは構築されません。データのリクエストが送信され、取得されましたが、リストビューが空でした。
サービスには更新されたデータを含む剣道データソースが既にあるため、可能であればリストを更新することをお勧めします。そのため、データベースを再度呼び出す必要はありません。
そのため、リストビューのセットアップは正常に機能しますが、onReactivate を更新すると壊れるだけで、リスト内のすべての li が 0 から始まるため、互いにオーバーラップします (ただし、更新はそこにあります。リフレッシュしました)。
後で行う必要があるためだと思います。もしそうなら、どうすればそれを行うことができますか?
refresh メソッドを適切に機能させる方法についてのアイデアはありますか? または、これを行うより良い方法はありますか?
抽象ビューは次のとおりです。
リストビューを宣言する方法は次のとおりです。
状態のコードは次のとおりです。
編集: さらに調査した結果、kendo.mobile.scroller が原因であることがわかりました。リストビューを更新している時点では利用できないため、リストビューの描画方法がめちゃくちゃになっています。リストビューはスクローラーの内側にあるため、これは私には意味がありません(後で調べても同じです)。スクローラーを削除すると、期待どおりに動作しますが、剣道ビューを使用しておらず、ページにフッターがあるため、そのスクローラーが必要です。コンテンツとともにスクロールし、プルを使用してスクローラーの機能を更新しています(リストビューのプルを使用して更新したくないのは、スクローラーが実行しているときに更新が発生する方法を処理できないためです)。
別の編集:リストビューでloadMoreがtrueの場合にのみ発生するという事実まで追跡しました。これをオフにすると、問題なく動作します。したがって、上記のコード例では、k-load-more="false" を設定すると機能します。エンドレススクロールでも試してみましたが、どちらも同じ効果があります。
angularjs - ui-route の使用中に $state.go の問題が発生し、URL が新しい状態に変更されましたが、新しいビュー コンテンツで html が変更されたことを確認できませんでした
メインページ、つまり、2 つのビュー (leftview) View1.html と (rightview) view2.html を持つ index.html があるシナリオがありますが、leftview でレコードを選択すると、右側のビューを view2.html からview3.html.
私は使っている
ビューを View2.html から View3.html に変更するには
しかし、URL が変更されてdetails/{id}
いることはわかりますが、UI (html マークアップ) が view3.html に変更されていることはわかりません(したがって、view3 のコントローラーも起動されません (簡単にするために以下のコントローラー コードを削除しました))。
どんな助けでも高く評価されます。必要に応じて、さらにコードを尋ねてください。
javascript - Angular Ui-Router-Extras | スティッキー状態を実装しようとしていますが、機能していません
さて、私はこのplunkrが私の状況をシミュレートしようとしています:
私には3つのタブがあり、ユーザーがテキストボックスに単語を入力し、ボタンをクリックすると、テキストボックスに入力された内容に従って角度サービスがDBから回答(結果)を返すという考えです(このプロセスをシミュレートしましたjson ファイルにデータを要求するため、何を入力しても重要ではなく、常にデータ全体が返されます)、別のビューにテーブルが入力されました。
私の目標は何ですか?さて、タブごとにすべてのビューをそのまま保持する必要があります。つまり、ユーザーがタブをクリックして (状態を変更して) 別のタブに戻ると、要求されたデータ (および検索ボックスに入力されたもの) がそこにある可能性があります。
編集:
私の定義を含む配列があります:
そして、私は自分の状態を次のように動的に定義します。
状態にのみ粘着性を適用しますhome.tab*.table
。これは機能しますが、期待どおりではありません。たとえば、検索ボックスに入力したものは、タブを変更すると消えます。3 つの配列 (後述) のコンテンツをタブごとに保持できるようにする必要があります。それは私の問題です。
私は3つの配列を持っています:
そして、配列のデータをクリアするために呼び出される関数を使用し$scope.clear_arrays
ます (でも$stateChangeSuccess
)。欲しいものを手に入れるのにこれでいいのかわかりません。
優れたangular-ui-router-extras(sticky states)
ライブラリを使用する必要があることはわかっていますが、私の場合にそれを適用する方法がわかりません。私は試してみました:
しかし、動作しません。いくつかのアイデア、いくつかの助け?
編集:
ドキュメントが言うように、私はまさにこの部分が必要です:
... アプリケーション内のタブの状態は、他のタブのいずれかに切り替えたときに終了しません。ユーザーは、ワークフローを中断することなく、タブ間を行き来できる必要があります。
angularjs - angularjsのコントローラーが2回実行されます
mainpage->allbookPage->eachbookpage->unitPage の 3 つのステップを持つ教育ページを作成します。以下のルートを使用してそれらを切り替えますが、eachbookpage に直接移動してユニットをクリックし、unitpage に移動すると、ユニット コントローラーが 2 回実行されます。2回実行するのを防ぐにはどうすればよいですか?