AngularJS: 绑定工作不正常

Question

我的 index.html 页面中显示了一个登录页面。 index.html 页面控制了一个导航栏，我不想在用户成功登录之前显示该导航栏。但是，在他们登录后，导航栏 ng-show 属性不会像我一样更新它在代码中。下面是代码来说明：

<nav class="navbar navbar-inverse" ng-controller="loginController" ng-show={{valid}}>
    <div class="collapse navbar-collapse navbar-collapse-links">
        <ul class="nav navbar-nav">
            <li><a ui-sref="addUser" class="addUser" >Add User</a></li>
            <li><a ui-sref="listUser" class="mdUser">Modify User</a></li>
            <li><a ui-sref="login" class="mdUser">Logout</a></li>
        </ul>
    </div>
</nav>

我的控制器内部是这样的：

$scope.valid = false;
function login() {
    AuthenticationService.Login(vm.user.username, vm.user.password, function (response) {
        if (response.success) {
            AuthenticationService.SetCredentials(response.token.UserName, response.token.TokenId);
            $scope.valid = true;
            $location.path('/');
            } else {
                //FlashService.Error(response.message);
                vm.error = response.message;
                vm.dataLoading = false;
            }
    ....
    )};
}

这些是对代码的粗略复制和粘贴，其中仅包含我认为当前问题所必需的内容。

我可以手动将声明更改为 true 或 false，并让导航栏正确运行。否则，在尝试有效登录后导航栏不会显示，并且当我在登录后检查控制台中的 html 时，ng-show 方法仍然显示为 false。

问题：为什么有效绑定在我的成功函数中重新分配后不能正确更改？

Answer 1

从 ng-show 中删除 {{ }}。这是您的代码的一个问题。

ng-show="valid"

并检查此以获取更多信息：

http://jaketrent.com/post/when-to-use-curlies-in-angular-directives/

Answer 2

如果您的 AuthenticationService 没有抽取摘要循环，Angular 将不会更新其绑定，因为它不知道发生了什么变化。

尝试将 .Login 回调的主体包装在 $scope.$apply().

中

此外，您在对用户进行身份验证后会立即离开此视图，因此您设置的 $scope.valid = true; 范围将消失。

您可以尝试在根作用域上设置一个标志，例如：$rootScope.isLoggedIn = true; 并绑定它，因为根作用域在应用程序的生命周期内一直存在。

您最好的选择是将身份验证状态存储在您的服务中并与其绑定。由于服务是单例的，因此该状态也会在视图之间保留。

Answer 3

努力改变，

<nav class="navbar navbar-inverse" ng-controller="loginController" ng-show={{valid}}>

至

<nav class="navbar navbar-inverse" ng-controller="loginController" ng-show="valid">

AngularJS: 绑定工作不正常

AngularJS: Binding not working correctly

javascript

html

angularjs

data-binding

ng-show