不能在角度中使用 ng-show 和 ng-hide

Question

我正在尝试从我的 Angular 控制器访问数据。该文件如下。以下是相关的范围和变量。

• 想法是当statusCode为401时，invalid_login必须为真。
• 并且当 statusCode 为 200（以下其他条件）时，logged_in 必须为 true。

这个想法是当

 $scope.invalid_login    = true;
        $scope.unexpected_error = false;
        $scope.logged_in        = false;


        $http({

            method: "POST",
            url: "/getUserInfo",

            data: {

                "username"        : $scope.username,

            }

        }).success(function(data) {

            if (data.statusCode == 401) {

                $scope.invalid_login    = false;
                $scope.unexpected_error = true;
                $scope.logged_in = false;

                alert('Status Code: '+data.statusCode);

            } else if(data.statusCode == 200){

                console.log('FROM LOGINCONTROLLER : ' + data.username);
                console.log('Status Code : ' + data.statusCode);

                $scope.username         = data.username;
                alert('Status Code: '+data.statusCode);
                $scope.invalid_login    = false;
                $scope.unexpected_error = false;
                $scope.logged_in        = true;


            }

        }).error(function(error) {

            $scope.logged_in        = false;        
            $scope.unexpected_error = true;
            $scope.invalid_login    = true;

        });

当我尝试在我的 ejs 中访问它时，它没有反映预期的行为。

• 我想在用户未登录时显示登录或注册选项：（logged_in = false 和 invalid_login = true）。
• 并且想要在（logged_in = true 和 invalid_login = false）时显示登录视图（带有退出选项）

以下是我的ejs的sn-p：

<div class                             ="dropdown"  ng-hide="true" style="font-size:small; text-decoration:none; margin-top:6px;">

                                    <a class                       ="dropdown">
                                        <a href                    ="#" style="text-decoration:none; color:#555555" class="dropdown-toggle" data-toggle="dropdown">Hi! <b>{{username}}</b><b class="caret"></b></a>

                                        <ul class                  ="dropdown-menu multi-column columns-1">

                                            <div class             ="row">

                                                <div class         ="col-sm-12">
                                                    <ul class      ="multi-column-dropdown">

                                                        <li class  ="h4"><b><a href="#">My Collection</a></b></li>
                                                        <li><a href="#">Account Settings</a></li>
                                                        <li><form action="logout" method="post">
                                                            <input type="submit" value="Logout"  class="btn btn-success"/>
                                                        </form></li>
                                                        <li><a href="#">Antiques</a></li>
                                                        <li><a href="#">Sports Memorabilia</a></li>
                                                        <li class  ="divider"></li>
                                                        <li class  ="h4"><b><a href="#">Electronics</a></b></li>
                                                        <li>

                                                        </li>
                                                        <li><a href="#">Coins & Paper Money</a></li>
                                                        <li><a href="#">Antiques</a></li>
                                                        <li><a href="#">Sports Memorabilia</a></li>


                                                    </ul>
                                                </div>

                                            </div>
                                        </ul>
                                    </a>
                                </a>
                            </div>



                            <a ng-show="invalid_login">


                            Sign In or Register


                            </a>




                            </li>
                            <li>

Answer 1

如最新的 Angular 1 版本 (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js) 中所述

$http 旧承诺方法 success 和 error 已被弃用。 请改用标准的then 方法。

已弃用但仍受支持，其代码为：

    promise.success = function(fn) {
      assertArgFn(fn, 'fn');

      promise.then(function(response) {
        fn(response.data, response.status, response.headers, config);
      });
      return promise;
    };

response.status 作为第二个参数传递给回调函数，所以你应该像这样检查它

.success(function(data, statusCode) {

        if(statusCode === 200){

            console.log('FROM LOGINCONTROLLER : ' + data.username);
            console.log('Status Code : ' + data.statusCode);

            $scope.username         = data.username;
            alert('Status Code: '+data.statusCode);
            $scope.invalid_login    = false;
            $scope.unexpected_error = false;
            $scope.logged_in        = true;


        }
}).error(function(error, statusCode) {
        // will be false only for 401 status
        $scope.logged_in        = statusCode !== 401;        
        $scope.unexpected_error = true;
        $scope.invalid_login    = true;

        alert('Status Code: ' + statusCode);
    });

最好是移动到 then(successFunction, errorFunction, notifyFunction) 而不是 success，但是你的数据将在 response.data ，以及response.status

下的状态码

SUCCESS状态码为200-299（含），其余状态将被errorFunction捕获