ember.jsの複数のレイアウト2.7.0

Question

/、/contacts、/rulesなどのようないくつかのルートを表示できるゲスト用に2つのレイアウトが必要です。また、認証されたユーザーにはもう1つ必要です許可されたルートに行く前にログインしてください。ルートのグループごとに2つのレイアウトを定義するにはどうすればよいですか？

Answer 1

内の認証されたルートをネストすることによって、この問題を解決するためにあなたの利点にエンバーのルータを使用する方法があります：あなたにのみ表示ログインしているユーザーは、単にこのようAuthenticatedRouteMixinを使用する経路を設定したい場合ルート。ここでは例としてルータです：/contactsと/rulesに行く

Router.map(function() { 
    this.route('contacts'); 
    this.route('rules'); 

    this.route('authenticated', { path: '/' }, function() { 
    this.route('settings'); 
    this.route('profile'); 
    }); 
}); 

は、任意の認証を必要としないだろうが、/settingsになり行きます。

pathオプションがauthenticatedルートに渡されていることに注意してください。 /に設定してURLに表示されないので、application.indexの代わりになります。これがあなたに奇妙に聞こえる場合は、インデックスページがin the Ember.js tutorialであることをお読みください。

Answer 2

答えは、ユーザーの状態を保存するサービスを維持することです。

次に、どのように編成したかによって、サービスをコントローラまたはルートに注入できます。だから - loggedIn

テンプレートには、ハンドルバー/ htmlbars ifヘルパーを使用します。

{{#if loggedIn}} 
    render logged-in stuff... 
{{/else}} 
    render message explaining that this is only for logged in users 
{{/if}} 

また、現在のセッションデータに基づいて別のルートにユーザーをリダイレクトすることもできます。特定の役割のルート全体を持つ場合や、役割に応じて異なる動作をするテンプレートの部分がある場合があります。

ログインしていないと、プロフィールページにアクセスできないことがあります。そのルートは完全に制限されていないか、ログインページにリダイレクトされる可能性があります。一方、ログインしていない場合は「hello sheriffderek」と表示されていた場合は、ログインボタンコンポーネントまたはテンプレートの一部になっている可能性があります。

さらに強力な「役割」アウトラインのためのEmberアドオンがあります。実際のユーザーには「編集」ボタンがあるかもしれないが、モデレータにとっては「フラグ」ボタンがあるかもしれないブログページを考えてみてください。この場合、どこかにネストされた完全に異なるルートを持つことはできません。

ほとんどの認証アドオン/ライブラリには、ある種のセッション状態を持つ「サービス」があります。しかし、テンプレート賢い、基本的な考え方は、JSのif/else文のようなものです。

if (helpful) { 
    this.upvote(); 
} else { 
    // something else 
} 

これが役立ちます。 ：）

Answer 3

はember-simple-authアドオンを見てください:)

それはあなたのユースケースのためのミックスインを含む、すべての許可についての多くの有用なクラスを持っています。

/app/routes/protectedRoute.js 
import Ember from 'ember'; 
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin'; 

export default Ember.Route.extend(AuthenticatedRouteMixin);