Question

我正在创建一个简单的应用程序，用户登录系统。用户登录后，其名称将显示在标题中。我正在创建单页Web应用程序。我的示例网页是：

    <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

我的角色是：

  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 =＆＃34; yayayayyayay＆＃34;不起作用。

是不是我们无法在回调方法中调用数据绑定变量？我没有发现任何与我面临的问题有关的事情。

Answer 1

您需要更新范围（就在$state.go之前）：

$scope.$apply();

Answer 2

你写的是：$cope.guest = user.username;而不是$scope.guest = user.username;

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

2 个答案: