問題タブ [angular2-router3]

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.

0 投票する
1 に答える
5273 参照

angular - TypeError: null Angular2 Router のプロパティ 'router' を読み取れません

以下は私のコンポーネントです。間違いの箇所はそのthis.router.navigate()部分です。ログイン後、ユーザーを別のページにリダイレクトしたい$state.go('dashboard').

そして、私はこのエラーを受け取り続けます。教えてください、私は何が間違っていますか?

ここに画像の説明を入力

0 投票する
1 に答える
317 参照

angular - Angular 2.0.1: 複雑なナビゲーション コンポーネントの簡素化

重要なアプリケーションとのナビゲーション コンポーネントの同期をどのように維持しますか? たとえば、Angular 2 の単純な Tour of Heroes アプリケーションでは、app.component.ts静的な (つまり不変の) 宣言型ナビゲーションがあります。

しかし、より複雑なアプリケーションでは、ナビゲーション コンポーネントが動的であることがよくあります。私の場合、navsidenav 戻るボタン、コンポーネント固有のアクション、およびユーザー情報があります。また、サイドナビゲーションアクションは、ユーザーの役割に応じて変化します。これはかなり典型的なシナリオです。Google Gmail、Inbox、Calendar、Docs などを考えてみてください。

現在、myは、現在のコンポーネントとユーザーの役割について多くのテストを行って実装さnavれた単一のコンポーネントになっています。これは醜い悪夢です。my-header*ngIf

my-headerコンポーネントは単純に に含まれていますapp.component.html:

しかし、my-headerコンポーネントもコンポーネントもmy-footerルーターツリーにないため、常にルートノードがmy-header注入されます。つまり、絶対的な戻るナビゲーションにActivatedRoute移行することさえできません。

相対ナビゲーションへ:

これは、同期を維持するために、この 1 つのコンポーネントでルーター ツリーを複製することを意味します。これは明らかに正しいことではありません...

ナビゲーション コンポーネントを複雑なアプリケーションと同期させるという、おそらく非常に一般的なこの課題をどのように解決するかについてのアイデアはありますか?

0 投票する
2 に答える
229 参照

angular - Angular 2でURL「localhost:3000/1234.xhtml」を解析するには?

このようにバックエンドによって .xhtml 拡張子でリンクが生成される状況があります。ユーザーは、与えられたこのリンクにアクセスするだけで、1234.xhtml から 1234 を取得し、それを使用してデータベースにクエリを実行する必要があります。クエリ パラメータの取得は明らかです。しかし、ルーターはこの URL を解析しません。「/1234.xhtml を取得できません」というエラーがスローされます。命令型ルーティングは機能します。したがって、これはブラウザまたはサーバーに関連する問題です。これを解決するには?

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

ここに画像の説明を入力

0 投票する
2 に答える
8712 参照

angular - Angular 2 でのルーティング中にコンポーネントの再作成を防止したい

と の 2 つのルートがあるDashboardとしProfileます。Dashboardのような動的タブ機能がありますGoogle spreadsheet。.. Dashboard_ ここで、 にルーティングしてProfileから に戻す場合Dashboard、 のそれらのタブに以前あったものを確認したいと思いますDashboard。つまり、クライアント側で状態を維持したいということです。コンポーネント間のルーティング中に知る限り、コンポーネントが再作成されます。angular 2ルーティングを使用しながら、アプリケーションのようなスプレッドシートを作成することは可能ですか? 私のアプリケーションでは LazyLoading 機能を使用する必要があるため、ルーティングを使用する必要があります。

では、どのようなアイデアを考えるべきでしょうか?私はAngular 2が初めてです。

0 投票する
1 に答える
542 参照

angular - 複数のルートパラメータを評価するAngular 2ルーター

私のアプリには、複数のパラメーターを持つルートがあります。

これらのパラメータを評価するにはどうすればよいですか? paramsqueryParamsのを購読できますActivatedRoute

ただし、もちろん、これにより負荷が 2 回トリガーされます。また、たとえば、上記の例のsalesfrom/の両方の情報が常に必要です。to

したがって、上記のコードは次のようになります

そして、負荷を 2 回トリガーするという問題に対する解決策はまだありません。

さらに悪いことに、自分の でどれだけレベルを上げる必要があるかを把握する必要もあるためActivatedRoute

うーん。とにかく、遅延ロードされたコンポーネントの場合、それはうまくいきません。いずれにせよ、ほんの一握りのルート パラメーターを取得するだけでも、大量のボイラープレート コードになります。

私はこれを間違っていますか?これについて推奨される方法はありますか?

0 投票する
1 に答える
968 参照

angular - routerLink queryParams をプロパティ値に設定するには?

コンポーネント プロパティを使用して[queryParams]forを設定する必要があります。routerLink

しかし、そのアプローチは機能しません。ルートにクエリ パラメータが追加されていません。私は何が欠けていますか?

0 投票する
1 に答える
1510 参照

angular - ngrxを使用したAngular 2ルーターv3の監視可能なガード

redux(ngrx) を使用して「認証アプリ」を作成しようとしており、シークレット ガードでアプリの状態を使用しようとしています。ここで私の github を見ることができます: https://github.com/tamasfoldi/ngrx-auth/tree/router これは私のガードがどのように見えるかです:

ルーターがプロミスとオブザーバブルを解決するため、問題ないはずの isLoggedIn 属性を返しますが、秘密の部分に移動すると、ルーターがそれをブロックします。ここに私のルートがあります:

redux では init 状態を受け取ったので、オブザーバブルの最初の放出をスキップしようとしましたが、どちらも機能しません。スキップコードは次のとおりです。

AuthService の認証機能を使用すると、正しく機能しますが、その解決策は「redux のような」ものではありません。ngrx で動作させる方法を教えてください。または、ガードで appstate を使用できませんか?

0 投票する
1 に答える
65 参照

angular - angular 2.0.0 ログイン成功後にリダイレクトする方法

ルーターから前の URL を取得する必要があります (ログイン ページにリダイレクトする前に) ルーターは前の URL を取得できますか?

この件に関して、新しい安定したルーター 3.0.0 とは関係のない古い投稿をいくつか見つけました。

0 投票する
1 に答える
1711 参照

javascript - IFrame (インライン フレーム) のアイテムをクリックして、特定の URL にルーティングする必要があります

こんにちは、angular 2 アプリケーションの 1 つのコンポーネントで i フレームを使用しています。

Component.ts

Component.html

i フレームでクリック イベントをトリガーしているときに、別のコンポーネントにルーティングする必要があります (これは、ルート コンポーネントのルーティング ファイルで既に指定されています)。

、i frame アプリ(mvc アプリ) 内で、クリック機能をトリガーしました

angular 2アプリのルートフォルダーにindex.jsを追加しました(index.htmlにリンクされています)

index.js

これで、i フレーム アプリ内をクリックして、angular 2 アプリ ページにアラートを表示できるようになりました。

ターゲットは、showme() の機能を変更して、angular 2 アプリのルートを変更することです。

どうすればできますか?

私はそれを解決するためにいくつかの方法を試しましたが、残念ながら私は何も得ることができません。

0 投票する
0 に答える
2404 参照

angular - タイプ XYZComponent は 2 つのモジュールの一部であり、モジュールはどのルートを取るべきか混乱します

これがシナリオです。UserConsoleModule と ShoppingCartModule があります。MyProfileComponent というコンポーネントがあります。/user-console に移動すると、MyProfileComponent が表示されるので、それを UserConsoleModule の宣言に入れました。/shopping-cart/profile では、ユーザーがチェックアウトするときに、すべての情報に問題がないことを確認するために彼のプロフィールを表示しています。そこで、MyProfileComponent を再利用して配置し、そのコンポーネントを ShoppingCartModule で宣言します。コンポーネントは2つのモジュールの一部です。なぜそれが2つのモジュールにあるのに気になるのかわかりません。それらは独立しています。再利用するコンポーネントが何であれ、その特定のモジュールでそれを宣言し、RC 5 以前の宣言と同じように良いと思いました。このモジュールのことは良いのですが、実際には多くの混乱を引き起こします。

もう一つの問題はルートです。UserConsoleModule と ShoppingCartModule の両方を再利用する AdminConsoleModule があります。私がしたことは、AdminConsoleModule のインポートで ShoppingCartModule をインポートしたことです。/shopping-cart が /shopping-cart/cart にリダイレクトされます。そのため、管理コンソールが読み込まれるとすぐに、/admin-console/cart にリダイレクトされます。ルーターアウトレットに UserResults をロードする必要があります。ルーターが混乱しています。ここで何か間違ったことをしていますか?

ソリューションの一部として、ショッピング カート コンポーネントのみを含む共有モジュールを作成しました。アイデアは、shared-shopping-cart.module.ts と shopping-cart.routing.ts を shopping-cart.module にインポートすることでした。 ts であるため、分離されたままになります。しかし、共有モジュールは、私のショッピングカート.コンポーネント.tsにルーターアウトレットがあるため、ルーターアウトレットが不明であるというエラーをスローします。

私の admin-console.routing.ts

私の AdminConsoleModule:

UserConsoleにはこれらのコンポーネントがあるため、my-profileとすべてをインポートしていません。

ユーザーコンソールモジュール

ショッピングカートモジュール

shopping-cart.routing.ts

AdminConsoleModuel のインポートで、UserConsoleModule を ShoppingCartModule の前に配置すると、UserConsoleRouting にもリダイレクトがあるため、admin-console/my-profile に移動します。

ここに user-console.routing.ts があります

最終的な解決策は、各コンポーネントのモジュールを作成し、それをどこにでもインポートするように見えると思います。:p