問題タブ [angularjs-routing]

少数のメイン ページに分割できるサイトを開発しています。これらのページは、セッション データ (つまり、セッション ID とログイン ユーザー名) を共有することを除いて、互いに分離されていると考えることができます。

最初は、ng-view を使用してサイトを SPA として構築するつもりでした (つまり、ページを AngularJS ビューにします)。しかし、私のサイトがそのように実装されても、何のメリットもありません。また、SEO ( AJAX アプリケーションをクロール可能にする)をサポートするには、余分な時間と労力が必要になります。

何の利益ももたらさず、余分な作業負荷を生み出すアプローチを採用することは、あまり賢明ではないようです。そこで、自分のサイトのメイン ページを個別の AngularJS アプリにしたらどうだろうと考えました。検索エンジンにインデックスを付ける必要があるサイトの部分は、それらのアプリの最初の画面にすぎないので、SEO のために余分な作業を行う必要はありません。(注: 最初の画面は、検索エンジンがクロールするデータを含む Django サーバーによってレンダリングされるため、空白ではありません。)

アプリごとに、要件に応じて、独自のパーシャルのセットがある場合とない場合があります。

例：

これは単なる私の勝手な考えであり、複数の AngularJS アプリで構成される AngularJS の例は見たことがありません。私が知りたいのですが：

1. 1 つのサイト アプローチに対して複数の AngularJS アプリを使用することは可能ですか? 知っておくべき注意事項は何ですか? このアプローチを採用しているサイトの例はありますか?
2. 可能であれば、アプリ間でセッション データを共有するにはどうすればよいですか?

この投稿は、1 つのサイトの複数の AngularJS アプリに関するものであり、同じページ上の複数の AngularJS アプリに関するものではないことに注意してください。

ルートを使用したいのですが、常に同じテンプレートとコントローラーを使用したいです。次のようなルートがあります。

と

最初のケースでは、画像の配列をロードしてリストに追加したいと考えています。2 番目のケースでは、1 つの画像を読み込んでリストに追加します。

したがって、違いはデータのロードのみです。これを行う最も効率的な方法は何ですか?

また、ng-show をアニメーション化することは可能ですか? jQueryのslideDownのようなもの？

古典的なリスト/詳細 UI を実装しようとしています。リスト内のアイテムをクリックすると、リストを表示したままそのアイテムの編集フォームを表示したい。私は Angular の 1 ページあたり 1 ビューの制限を回避しようとしており、すべての URL を同じコントローラー/ビューにルーティングすることでそれを行うことにしました。（おそらくこれが私の問題の根源であり、私は代替手段を受け入れています。）

ルーティング：

ビュー (/Partials/Users.html):

コントローラ：

問題:

1. 編集リンクをクリックすると、コントローラーが新しいスコープで再インスタンス化されるため、ユーザー リストを再初期化する必要があります。(より複雑な例では、ユーザーからの入力をモデルにバインドして保存することができ、これも失われます。) 前のルートからのスコープを保持したいと思います。
2. 別のコントローラーを使用することをお勧めします (または、他の多くの Angular 開発者が不満を言っているように、複数の表示ビューを持つ機能!) が、スコープを失うという同じ問題につながります。

このようなアプリを作るためにAngularJSを学んでいます。

サンプル サイトでは、雑誌の 1 つの号のグローバル JS オブジェクトを使用してそのページを管理し、クリック ハンドラーを使用してページの切り替えやその他の操作を処理します。また、ページはめ込み効果は、JS コードを直接呼び出すことによってトリガーされます。

これを AngularJS で実装するとき、しかし、アーキテクチャがどのようになるかについて混乱しています...
現在IssueDetailController、応答するのは 1 つだけです。'/:issueId/:pageNumber'コントローラー内で、ページのコンテンツが DOM のように注入されます$compile(page_content)(new_scope_for_page_content)。正しい方法ではないと感じています。

だから私の質問は、次のような賢明なアーキテクチャとは何かということです。

• コントローラー/ビューの構造 (ページと課題用に 2 つの別個のコントローラーが必要ですか。たとえば)
• ページの遷移 (コントローラー/ビュー全体がまだわかりにくいため、どの時点ng-animateまたはカスタム ディレクティブ (たとえば、この jQuery プラグインをラップする) を適用できるかわかりません。)

、例のようなアプリの場合、一般的に? ヒントをいただければ幸いです =)

構成モジュールで html5mode を true に有効にすると、アコーディオン グループを開く「ハイパーリンク」が URL をベース URL に再ルーティングします。アコーディオン グループが開かないだけでなく、ルートが変更されます。html5mode が有効になっていないときに、アコーディオン グループが正常に動作していました。

これに対する簡単な修正はありますか、それとも angularjs-ui ソースに深く入り込む必要がありますか? それとも、私は html5mode で運が悪いのでしょうか? 私のアコーディオン コードは非常に単純です。

[編集]

パーシャルとテンプレートの複雑なネストと同様の質問

今のところ、Angular-UI 状態ソリューションを使用する方が良いですか、それとも ng-includes に固執する必要がありますか?

これまでのところ、AngularJS アプリケーションでは URL ごとに 1 つのビューがありました。新しいビューを作成する必要があります。これには 3 つのタブが必要ですが、ビューをどのように設計するかを理解するのに苦労しています。つまり、アーキテクチャに関してです。

これら 3 つのタブの背後にあるビジネス モデル オブジェクトは同じものであることに注意してください。

最初のタブは、ビジネス オブジェクトのデータを表示および編集するためのものです。つまり、最初のタブにはすでに 2 つの「ビュー」があります。

2 番目のタブは、ビジネス オブジェクトの子コレクションからのデータを示すページ テーブルを表示するためのものです。

3 番目のタブは 2 番目のタブと同じことを行いますが、別の子コレクションを対象としています。

明らかに、ビジネス オブジェクト全体を一度にロードしたくありません。ユーザーが 2 番目または 3 番目のタブに移動した場合にのみ、コレクションを読み込みます。

現在の私の主な関心事は、ビューをどのように整理するかということです。AngularJS には、ページごとに 1 ビューのみという制限があります。

また、ブラウザーの履歴を処理する必要があるため、タブが選択されたときに URL を変更する必要がありますが、データを再読み込みする必要があります (つまり、コントローラーを再読み込みしてはなりません)。

どんなヒントでも大歓迎です。

スーパーフィッシュメニューと組み合わせてルーティングでangularjsを使用しようとしています。私の Web アプリケーションは MVC アプリケーションであり、Superfish メニューを使用して Web アプリケーション内をナビゲートしています。superfish メニューには、MVC アプリケーションの他のビューに移動できるリンクが含まれています。

これらのビューの 1 つは、ルーティングを使用する角度のあるアプリです。しかし、このAngularアプリがロードされた後、Angularがそれらをインターセプトし、Angularルーティングで処理する必要があると考えるため、私のスーパーフィッシュメニューはもう機能しません.

angularjs にスーパーフィッシュ メニューのアンカー リンクを無視させる方法はありますか? この MVC アプリケーションに角度を徐々に導入しているため、完全な MVC アプリケーションを SPA にリファクタリングすることはできません (大きすぎて一度に変換できません)。

ドキュメントにあるように、各アンカー target="_self" を配置しようとしましたが、いくつかの機会に、角度によってキャプチャされます (おそらく、一部のスーパーフィッシュ メニュー項目には href の「#」のみが含まれているためです (それらは親メニューであり、サブメニュー)

私はAngularアプリを開発しています.url:http://localhost/angular/MyAngularRewind/でブラウザをヒットすると、index.htmlは開いていませんが、実際にはindex.htmlを開く必要があります。

C:\wamp\www\Angular\MyAngularRewind---> これは私が index.html を持っているパスです。下のスクリーンショットを参照してください

しかし、このURLでヒットするとページが開き、次http://localhost/angular/MyAngularRewind/index.htmlのように変わりますhttp://localhost/angular/MyAngularRewind/index.html#/

理想的には、以下のことが起こっているはずです: URL をヒットするhttp://localhost/angular/MyAngularRewind/と、URL が自動的に に変更されたページが開くはずhttp://localhost/angular/MyAngularRewind/index.html/#/ですが、それは起こっていません。

ファイル構造のスクリーンショットを参照してください。

索引.html

Javascript:

助けてくれてありがとう。

各エントリが選択可能な単純なリストを表示します。ただし、選択時に余分なビューはロードされません。すべてが入っていticket_lost templateます。テンプレートには、エントリをクリックすると表示される隠しフィールドがいくつかあります。

設定することで、どのエントリが内部的に選択されるかを定義できます

したがって、次のようなルートがある場合

selectedTicket を 1 に設定する関数を呼び出したいのですが、可能ですか? どうやってするか？ルーティングで何を変更する必要がありますか?

私のようにapp.js見える

私app/js/services/categories.jsのように見えますが

そして、私は次のようなルートを持っています

私のコントローラーapp/js/controllers/transactionController.jsは次のようになります

アプリを実行すると、console.log が次のように表示されます。

ここで私が間違っていることは何ですか？