Angular: how create a login/logout in a ng-include template?

Question

I have a login JWT Auth with Angular and i want my template ng-include (header) hide my "login/subscribe link" and show my "logout" link.

But that's doesn't work... Or i need to refresh my webpage and i don't want.

how create a login/logout in a ng-include template ?

I have: ui.router, aclservice, jwt auth, angular 1.5.8 Thx

MY HEADER (NG-INCLUDE IN INDEX.HTML BEFORE THE VIEW)

 <ul class="list-inline">
                        <li ng-hide="goLog"><a href="/login"><i class="glyphicon glyphicon-user"></i> Sign up</a></li>
                        <li ng-hide="goLog"><a href="#"  ng-click="">Sign in</a></li>
                        <li ng-show="goLog"><a href="#" ng-click="">Logout</a></li>
                    </ul>

PART OF MY CONTROLLER LOGIN

        function login(username, password) {
        auth.login(username, password).then(loginComplete);

        function loginComplete() {

            if (AclService.hasRole(ROLE_ADMIN)) {
                $state.go('dashboard');
            } else {
                $state.go('home');
            }
        }
    }

MY VIEW LOGIN

<form name="form" role="form" ng-submit="vm.login(vm.username, vm.password)">


                            <div class="form-group">
                                <input type="text" placeholder="e-mail" class="form-control input-lg" ng-model="vm.username" required autofocus>
                            </div>
                            <div class="form-group">
                                <input type="password" placeholder="Mot de passe" class="form-control input-lg" ng-model="vm.password" required>
                            </div>

                            <div class="form-group go-to">
                                <button type="submit" class="btn btn-lg btn-block" ng-disabled="form.$invalid || dataLoading">Login</button>
                            </div>
                        </form>

Answer 1

Try this link: https://code.tutsplus.com/tutorials/token-based-authentication-with-angularjs-nodejs--cms-22543

Above link clearly explains signing up process using JWT token.

To hide and show login logout use:

<div class="form-group go-to">
<button type="submit" data-ng-show="!isLoggedIn" class="btn btn-lg btn-block" ngdisabled="form.$invalid||dataLoading">Login</button>                  

 <button type="submit" data-ng-show="isLoggedIn" class="btn btn-lg btn-block" ngdisabled="form.$invalid  ||dataLoading" ng-click="logOut()">Logout</button>               

</div>

manage the 'isLoggedIn' variable in controller based on login status. On successful login set 'isLoggedIn = true'