2017-12-15 9 views
0

最後に* /:category_nameという動的セグメントを持つワイルドカードルートに手動で移行するためのember-wayアイデアは、手動で "breadcrumbish url version"の例を作成することができます。 /バナナに入る/食べ物/健康/フルーツ/バナナにユーザーを移行する必要があります....食料雑貨、健康、フルーツが入力される可能性があります/フルーツは/食料雑貨/健康/フルーツに移行される... window.history.replaceStateをルートのモデルフックに使って動作させることができましたが、奇妙なことに、テンプレートで遷移中ではなく、リフレッシュされたりタイプされたりする場合にのみ機能します。Ember.jsワイルドカードURL

ルートそのままで

this.route('products', function(){ 
    this.route('wildcard_handler', {path: '*/:category_name'}); 
    this.route('handler', {path: '/:category_name'}) 
}); 

要約例:

ケース1:

ユーザー入り/製品/バナナ

-redirectへ/製品/食料品/健康/果物/ バナナ

ユーザーが入力します/製品/果物

リダイレクト先/製品/食料品/健康/ フルーツ

ケース2:

ユーザー/製品/ 食料品

は-All良い入り、それが正しいのです。

ケース3

ユーザ入る/製品/食料品/スナックそう存在-doesn't

、404のリダイレクト。

このトラブルのすべては、私だけが構築しています新しいeコマースのための優れたUXを作るために、通常の提案方法は、ちょうどそれが公正だ

this.route('products', function(){ 
    this.route('handler', {path: '/:category_name'}) 
}); 

のように1つの動的セグメントに

を使用することですあなたがリダイレクトしたい場合は :それは、再び、事前に感謝

答えて

3

ケース1をbreadcrumbishのURL

を構築する方法立派ですあなたはモデルを解決する前に別のルートにユーザー、beforeModel()フックを使用することができます。 redirect()フックを使用して、ユーザーを別のルートにリダイレクトすることもできます。例えば、(ユーザーの訪問/製品/果物、あなたはredirectフックの製品/食料品/健康/果物にリダイレクトすることができたときに)、

redirect(model, transition) { 
    this._super(...arguments); 
    this.transitionTo('products.groceries.healthy.fruit'); 
} 

はルートで事前に定義されたフックを知って、このを参照してください。

ケース3: このlinkを参照して、アプリケーションで経路をワイルドカードする方法について説明してください。