AngularJSでルーティングを使用しているときに別のページから要素を制御するにはどうすればよいですか？

Question

私は簡単なログインフォームの例を取っ​​ています。以下 は

<ul class="nav navbar-nav navbar-right navbar-static-top"> 
     <li><a href="#!signup"><span class="glyphicon glyphicon-user"></span>Sign Up</a></li> 
     <li><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Log In</a></li> 

     <li><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Log out</a></li> 

    </ul> 

これらのindex.htmlからのコンテンツの一部は、私が使用しているコントローラであるされています

var app = angular 
.module('ModuleApp', ['ngRoute']) 
.config(function($routeProvider) { 
    $routeProvider 
     .when("/home", { 
      templateUrl: 'home.html', 
      controller: 'homeController' 
     }) 
     .when("/signup", { 
      templateUrl: 'signup.html', 
      controller: 'signupController' 
     }) 
     .when("/login", { 
      templateUrl: 'login.html', 
      controller: 'loginController' 
     }) 
     .when("/database", { 
      templateUrl: 'database.html', 
      controller: 'databaseController' 
     }) 
     ; 
}) 

私の目的は、ログインページを作成することです。ユーザーがログインした後、アンカー要素「サインアップ」と「ログイン」を非表示にしたい場合は、「ログアウト」アンカー要素が表示されます。 これはログインページの送信ボタン、つまり 'login.html'によって制御されます。

index.htmlの要素を別のページから制御するにはどうすればよいですか？ログイン後、つまり送信ボタンをクリックしてこの「ログイン」ボタンを非表示にしたり無効にするにはどうすればよいですか？

Answer 1

これは、ユーザーが既にログに記録されているかどうかを確認するグローバルな状態を使用することで実現できます。

私はそのためにセキュリティ上の問題をお勧めしませんが、あなたはこれを行うことができます：

ユーザー認証が行われ、あなたのコントローラロジックで

<li ng-if="!logged"><a href="#!signup"><span class="glyphicon glyphicon-user"></span>Sign Up</a></li> 
    <li ng-if="!logged"><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Log In</a></li> 
    <li ng-if="logged"><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Log out</a></li> 

、あなたのlogged値を変更します。

$rootScope.logged = true;