Question

我试图在显示当前登录用户的主页上添加一个简单的功能。我将GET发送到/ user端点，返回原则。这个角度学习曲线让我慢慢拉出我所有的头发，因为我无法弄清楚为什么当其他一切工作时这不起作用。我可以想到为什么它可能不起作用的唯一原因是我已经在不同的控制器（用于登录）中向/用户发送GET，但我不知道为什么这会导致它不均匀显示在Chrome XHR中。

的index.html：

                <!doctype html>
                <html ng-app="wishingWell">
                <head>
                    <meta charset="UTF-8">
                    <meta name="viewport"
                          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
                    <meta http-equiv="X-UA-Compatible" content="ie=edge">
                    <link rel="stylesheet" href="/css/normalize.css">



                    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
                    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.js"></script>
                    <script   src="https://code.jquery.com/jquery-3.1.1.js"   integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA="   crossorigin="anonymous"></script>
                    <script src="/javascript/app.js"></script>

                    <title>Wishing Well</title>
                </head>

                <body>
                        <nav class="nav" ng-controller="home as controller">
                            <ul class="navback">
                                <li>
                                    <a class="active" href="#/">The Well</a>
                                </li>
                                <li ng-hide="!authenticated">
                                    <a href="#/profile" >Profile</a>
                                </li>
                                <li ng-hide="authenticated">
                                    <a href="#/sign-up">Sign Up</a>
                                </li>
                                <li ng-hide="authenticated">
                                    <a href="#/login">Log In</a>
                                </li>
                                <li ng-hide="!authenticated">
                                    <a href="" ng-click="controller.logout()">Sign Out</a>
                                </li>
                                <li id="right" ng-hide="!authenticated">
                                    <p>{{controller.user.name}}</p>
                                </li>
                            </ul>
                        </nav>

                        <div ng-view></div>

                        <script src="/javascript/wishAJAX.js"></script>
                </body>
                </html>

app.js：

            var wishingWell = angular.module('wishingWell', [ 'ngRoute' ]);

            wishingWell.config(function($routeProvider, $httpProvider) {

                $routeProvider.when('/', {
                    templateUrl : 'home.html',
                    controller : 'home',
                    controllerAs: 'controller'
                }).when('/login', {
                    templateUrl : 'login.html',
                    controller : 'navigation',
                    controllerAs: 'controller'
                }).when('/sign-up', {
                    templateUrl : 'sign-up.html',
                    controller : 'register',
                    controllerAs: 'controller'
                }).otherwise('/');

                $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';

            });



                    wishingWell.controller('home', function($rootScope, $http, $location) {
                    var jsonResponse;
                    var jsonString;
                    var self = this;
                    self.user = {};

                    $http.get('user').then(function(response) {
                        jsonString = JSON.stringify(response.data);
                        jsonResponse = JSON.parse(jsonString);

                        self.user.name = jsonResponse.principal[0].username;
                        console.log(self.user.name);
                    });


                    self.logout = function() {
                        $http.post('logout',{}).finally(function() {
                            $rootScope.authenticated = false;
                            $location.path("/");
                        });
                    }
                });

让我知道是否有任何其他控制器需要知道为什么这不起作用。 Spring中的REST控制器适用于登录控制器，非常简单，因此我没有包含它。 home.html是注入但在这里没有关系，因为我把名字放在最后一个＆＃34; li＆＃34; ＆＃34; nav＆＃34;中的元素，并在导航部分中声明了控制器。注销功能也很有效，因此非常感谢任何想法。

Answer 1

对于将来偶然遇到这种情况的任何人，我发现因为我的<nav>元素在ng-view之外，这个控制器在加载页面时只被实例化一次，这就是为什么登录后不会更新。将get()放入函数中解决了这个问题。

Spring + Angular GET没有注册

1 个答案: