2016-10-04 90 views
0

我正在用戶登錄到系統中創建一個簡單的應用程序。 用戶登錄後,他的名字顯示在標題中。我正在創建單頁網絡應用程序。 我的示例網頁是:angularJS中的數據綁定在回調函數中不起作用

<body ng-app="homePageApp" ng-controller="homeController"> 
     <div class="page-header" style="margin-left: 5%"> 
      <ui> 
       <header> 
        <div> 
         <li ng-hide="userDiv" ng-click="hideIt()"><a ui-sref="userPage">SignIn or Register</a></li> 
         <li><a>profile {{guest}}</a></li> 
        </div> 
       </header> 
      <hr> 
:::::: // too much code below 

我angularjs是:

var homePage = angular.module('homePageApp', [ 'ui.router' ]); 

homePage.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider.state('/', { 
     url : '/', 
     templateUrl : '/templates/home.ejs' 
    }).state('home', { 
     url : '/home', 
     templateUrl : '/templates/home.ejs' 
    }).state('userPage', { 
     url : '/userPage', 
     templateUrl : './templates/userPage.ejs' 
    }).state('userPage.signin', { 
     url : '/signin', 
     templateUrl : './templates/signin.ejs', 
     controller : 'signinController' 
    }).state('userPage.register', { 
     url : '/register', 
     templateUrl : './templates/register.ejs', 
     controller : 'registerController' 
    }) 
}); 

homePage.controller 

homePage.controller('homeController', function($http, $state, $scope, 
     $rootScope, $log) { 
    $log.info($state.current); 

    $scope.hideIt = function() { 
     $scope.userDiv = true; 
    } 

    $scope.signinUser = function(user) { 
     $http({ 
      method : "POST", 
      url : "/signin", 
      data : user 
     }).then(function(res) { 
      if (res.data['status'] == 'success') { 
       $scope.guest = user.username; 
       $state.go('home', { 
        'user' : user.username 
       }); 
      } 
     }, function(err) { 
      $log.info("Something bad happenned"); 
     }); 
    } 

    // for register 
    $scope.registerUser = function(user) { 
     $http({ 
      method : "POST", 
      url : "/register", 
      data : user 
     }).then(function(res) { 
      $hhtp({ 
       url : '/home', 
       method : "POST", 
      }).then(function(response) { 
       $log.info('Something something'); 
      }) 

     }, function(err) { 
      $log.info("Something bad happenned"); 
     }); 
    } 
}) 

在上面的代碼,我hideIt()方法的工作,但是當我有成功登錄,則$ scope.guest = 「yayayayyayay」不起作用。

難道我們不能在回調方法中調用數據綁定變量嗎? 我沒有找到與我面臨的問題相關的任何事情。

+0

是U tryed instated $範圍 –

+0

什麼是您的$狀態$ rootScope變量。走 ?我認爲我們需要看到你的路線和控制器......我很確定你在更新它後重新加載你的範圍。 –

+0

我已經添加了完整的java腳本文件 –

回答

0

你需要(只是$state.go之前)更新範圍:

$scope.$apply(); 
0

你寫:的$cope.guest = user.username;代替$scope.guest = user.username;