綁定不會在angularjs中刷新

Question

我使用的是AngularJS，我需要您的幫助來在用戶登錄後更新HTML的內容。 事實上，當我加載頁面時，HTML只加載控制器一次，用戶尚未記錄。但登錄後HTML不刷新頁面，顯示用戶的登錄名？我該如何解決這個問題。 下面是我的HTML

<section class="hero hero-1 hero-small" ng-controller="HomeController"> 

    <header class="navbar" role="navigation"> 
     <div class="container" ng-controller="UserController"> 
      {{username}} 
      <nav> 
       <a class="navbar--logo" ui-sref="home">EspritAcademy</a> 
      </nav> 
      <nav> 
       <ul class="navbar--list pull-right"> 
        <li class="navbar--list-item"><a ui-sref="#">Features</a></li> 
        <li class="navbar--list-item"><a ui-sref="#">Courses</a></li> 
        <li class="navbar--list-item" ng-hide="isLoggedIn()"><a 
         ui-sref="login">Sign in</a></li> 

        <li class="navbar--list-item dropdown" 
         ng-controller="DropdownCtrl" dropdown is-open="status.isopen" 
         ng-show="isLoggedIn()"><a ui-sref="#" 
         class="dropdown-toggle" data-toggle="dropdown" dropdown-toggle 
         ng-disabled="disabled"> <b>{{username}}</b><b class="caret"></b> 
        </a> 
         <ul class="dropdown-menu" style="left: inherit; right: 0;"> 
          <li><a ui-sref="#">My Profile</a></li> 
          <li><a ui-sref="#">Account Settings</a></li> 
          <li ng-click="logout()"><a ui-sref="home">Logout</a></li> 
         </ul></li> 
        <!-- <li class="navbar--list-item" ng-click="logout()" 
         ng-show="isLoggedIn()"><a ui-sref="home">Déconnexion</a></li> --> 

        <li class="navbar--list-item" ng-hide="isLoggedIn()"><a 
         class="rounded-button blue-button" ui-sref="register">Start 
          learning</a></li> 
       </ul> 
      </nav> 
     </div> 
    </header> 
</section> 

和我的控制器：

controller(
      "HomeController", 
      function HomeController($scope, sessionService) { 
       $scope.isLoggedIn = sessionService.isLoggedIn; 
       $scope.logout = sessionService.logout; 
      }).controller(
        "UserController", 
        function UserController($scope, accountService) { 
         console.log("Hello"); 
         var loggedUser = {}; 
         loggedUser = accountService.getuser(); 
         if ((loggedUser)) { 
          $scope.username = loggedUser.username; 
          console.log("username : ", $scope.username); 
         } 
        }).controller('DropdownCtrl', 
      function($scope, $log) { 
       $scope.status = { 
        isopen : false 
       }; 

       $scope.toggled = function(open) { 
       }; 
      }); 

，我現在面臨

問題是與顯示器{{名}}。下面的 是用於使用Java後端的休息技術獲取用戶詳細信息的工廠。

factory(
      'accountService', 
      function($resource, sessionService) { 
       var service = {}; 
       service.register = function(account, profile, success, 
         failure) { 
        if (profile.id == 1) { 
         var Account = $resource("/rest/account"); 
         Account.save({}, account, success, failure); 
        } else { 
         var Account = $resource("/rest/account/teacher"); 
         Account.save({}, account, success, failure); 
        } 
       }; 
       service.userExists = function(account, success, failure) { 
        var Account = $resource("/rest/account"); 
        var data = Account.get({ 
         username : account.username, 
         password : account.password 
        }, function() { 
         console.log("user details : ", data); 
         var accounts = data.username; 
         if (accounts && accounts.length !== 0) { 
          console 
            .log("profile id :", 
              data.userProfile.id); 
          service.data = data; 
          success(account); 
         } else { 
          failure(); 
         } 
        }, failure); 
       }; 
       service.getuser = function() { 
        return service.data; 
       }; 
       return service; 
      }) 

我不需要繼續刷新我的頁面我只需要在用戶登錄後才加載UserController。用ng-if或其他方法可以嗎？

Answer 1

我想你必須實例化用戶控制器只有當用戶登錄，這是目前沒有案件。

嘗試改變這種

<div class="container" ng-controller="UserController"> 

這個

<div class="container" ng-controller="UserController" ng-if="isLoggedIn()"> 

Answer 2

由於getuser()總是返回一個對象嘗試以下

function HomeController($scope, accountService) { 
    //will always be object but may not have `username` property 
    $scope.loggedUser = accountService.getuser(); 
} 

然後在標記使用

{{loggedUser.username}} 

所以，現在當username物業在服務得到更新它會通過被綁定一路到視圖