angularJS中的数据绑定在回调函数中不起作用

问题描述:

我正在用户登录到系统中创建一个简单的应用程序。 用户登录后,他的名字显示在标题中。我正在创建单页网络应用程序。 我的示例网页是: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脚本文件 –

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

$scope.$apply(); 

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