問題タブ [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 に答える
1471 参照

angular - ページのロード/アンロード時にページにフェードイン/アウト効果を実装するにはどうすればよいですか?

基本的なアニメーション部分が接続されていると思います。処理するイベントを知る必要があるだけです。理想的には、すべてのコンポーネントをラップできるようにナビゲーション レベルで使用できるソリューションが必要ですが、ページの読み込みの簡単な例で十分であり、非常に高く評価されます。関連するSOに関する他のいくつかの質問を見つけましたが、それらは私の特定の質問に答えていないか、古くなっているようです:

ルーティングされたコンポーネントの Angular 2 の「スライド イン アニメーション」 Angular 2.0 ルーターとコンポーネント インターフェイスの約束によるページ遷移アニメーション

これが私がこれまでに持っているものです:

htmlファイル

成分

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

angular - Webpack で AsyncRoute を使用してコンポーネントを非同期ロードするにはどうすればよいですか?

最新の angular-webpack-starter (@angular/router 3.0.0-beta.2 を使用した RC4) で非同期モジュールの読み込みを実行する方法を理解できていません。

例が含まれていますが、より多くの説明、何をすべきか、およびこれがどのように連携するかを取得すると役立ちます.

私がしたこと: - 怠惰なコンポーネントルートをエクスポートしました:

次に、親コンポーネントのルートに子ルートをインポートして使用しました。

そして、すべてのコンポーネントに対して次のような非同期ルートを定義しました。

TestApp に移動すると、browser_adapter.js:84 Cannot read property 'path' of undefined からエラーが発生します。これを行う正しい方法は何ですか?

また、非同期読み込みのコンポーネント名は、アプリケーション全体で一意でなければならないのでしょうか?

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

angular - ルーター 3.0.0-beta.2 を使用した Angular 2: 子の横にワイルドカードを使用することは可能ですか?

他の /parent/child の横に /parent/:id のような動的ルートが必要です。

私はこのようなことを試みましたが成功しませんでした:

export const routes: RouterConfig = [ { path: '', component: HomeComponent }, { path: 'parent', component: ParentComponent,canActivate: [ WebpackAsyncRoute ], children: [ { path: ':id', component: 'ParamComponent' }, { path: 'child', component: 'ChildComponent' }, { path: 'anotherchild', component: 'AnotherChildComponent' } ] } ];

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

angular - Angular 2ルートの現在のURLとパラメータ

新しいルーターでAngular 2 rc-4を使用しようとしています。

次に、ルート変更イベントをサブスクライブします。イベントが発生したときにアイテムを見つけたい

問題は、パラメーターを含む URL にあります。

現在のページの URL と比較する方法や、RouterConfig に問い合わせる方法がわかりません。

手伝ってくれませんか?

0 投票する
7 に答える
80497 参照

angular - モジュールの子としてモジュールにルーティングする方法 - Angular 2 RC 5

現在取り組んでいるアプリケーションを最新の Angular 2 リリース候補にアップグレードしています。この作業の一環として、NgModule 仕様を使用して、アプリケーションのすべての部分をモジュールに移行しようとしています。ほとんどの場合、ルーティングの問題を除いて、これは非常にうまくいきました。

私のアプリはモジュールの構成として構築されており、いくつかのモジュールが親モジュールの子として一緒に接着されています。たとえば、通知モジュール、ユーザー モジュール、および電話モジュール (たとえば) で構成される管理モジュールがあります。これらのモジュールへのルートは次のようになります...

ルーターの以前のリリースでは、これは「子」を使用して簡単に実現できました。

別のファイルでは、サブモジュールの一部として、個々のモジュール ルートも定義します。

これはすべて非常にうまく機能しました。モジュールへのアップグレードの過程で、代わりにすべてを独自の個別のルーティング ファイルに移動したため、これら 2 つのファイルは次のようになりました。

これらすべてが整ったら、userRouting をインポートする UsersModule と、adminRoutes と UsersModule をインポートする AdminModule があります。私の考えでは、UsersModule は AdminModule の子であるため、ルーティングは以前と同じように機能します。残念ながら、そうではないので、ただのユーザールートになってしまいます

それ以外の

さらに、このため、新しいユーザー コンポーネントは管理コンポーネントのルーター アウトレットに読み込まれず、アプリケーションのスタイリングとナビゲーションが失われます。

私の人生では、UserModule のルートを AdminModule の子として参照する方法を考え出すことはできません。これを古い方法で実行しようとしましたが、ルートが 2 つのモジュールにあるというエラーが発生しました。これは明らかに新しくリリースされたものであるため、これらのケースの一部に関するドキュメントは少し限られています。

誰でも提供できるヘルプをいただければ幸いです。

0 投票する
3 に答える
34105 参照

angular - ActivatedRoute のプロバイダーがない - Angular 2 RC5

ActivatedRouteAngular 2 RC5 (RC4 から) にアップグレードした後、コンポーネントに注入できなくなったようです。

元の例外: ActivatedRoute のプロバイダーはありません!

関連するコードは次のとおりです。

そしてここに私のapp.module.ts

「Tour of Heroes」の例を確認しましたが、まったく同じことを行います。プロバイダー宣言がないActivatedRouteため、ここで何が起こっているのでしょうか?

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

angular - Angular 2 RC5/Router 3 RC1 のネストされたモジュールのルーティング

次の設定があるとしましょう:

ルートを次のようにしたい

そこで、次のルーティング宣言を定義します。

app.routing.ts

employee.routing.ts

sales.routing.ts

私のモジュールは次の形式を取ります:

app.module.ts

employee.module.ts

sales.module.ts

に移動できるようになりました

しかし、私がナビゲートしようとすると

でお出迎えです

エラー: どのルートとも一致しません: 'employee/14/sales'

入ることはできますが、

それは機能するはずがありませんが機能するため、何らかの方法ですべてのルートが相互/に構築されるのではなく、直接接続されます。

私は何が欠けていますか?

問題を示すEDIT plkr は、ここにあります。

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

angular - Angular2 RC5/Router3 RC1 で補助ルートはどのように機能しますか?

Web 上には補助ルートに関する情報はほとんどありません。RC5/RC1 についてはさらに少なく、ここ SO の誰かがそれらを機能させることができたことを願っています (修正されているはずですが、それだけです)。 .

次のルーティング宣言を取得しました。

routerLinkこれが次のとおりですoutletContactsComponent

ただし、これは次のようなエラーメッセージにつながるだけです

エラー: どのルートとも一致しません: 'contacts/form%3Anew'

Angular2 RC5/Router3 RC1 の実際の例はありますか?

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

angular - Angular2 RC5 - 構成ファイルのロードが完了した後のルーティング

RC5 を使用して Angular2 アプリを作成しています。

AppComponent が読み込まれると、アプリケーションが http を使用して構成ファイルを要求し、読み込まれたら指定されたルートにアプリが移動するようにしますか?

どうすればそれを達成できますか?

各ルートには「canActivate」プロパティがありますが、ユーザーが新しいルートに移動するたびに何かをしたい場合は、もっと関係があることがわかります。ほとんどの場合、少数のルートのみを認証で保護する認証目的で使用されますが、私の場合は AppComponent のロード時に構成をロードしたいと考えています。すべてのルートのアクティベーションまたはナビゲーションではありません。

自分が何を達成しようとしているのかを明確にしたことを願っています。

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

angular - angular 2 ルーター 3.0.0-rc.1 はルートのグループを保護するガードを無効にします

子ルートの外をナビゲートするときにのみトリガーされる非アクティブ化ガードを作成したいと思います。

rc4 ("@angular/router": "3.0.0-beta.1") では、このコードは次のように機能していました。

この例では、XComponent から YComponent への移動は非アクティブ ガードをトリガーしませんでしたが、たとえば、"someNotChildComponent" への移動ではトリガーされました。

@angular/route 3.0.0-rc.1 に更新した後、パスが変更されるたびにガードがトリガーされます。正しい行動とは?このケースを処理するためのより良い方法はありますか?