angularjs中的“未捕获的SyntaxError：意外的令牌u”

Question

我的登录页面上出现Uncaught SyntaxError: Unexpected token u错误。 我正在使用angularjs和localstorage。

HTML

<div class="login-body">
   <div class="container">
      <div class="col-lg-8 col-md-8 col-sm-8 col-lg-offset-4 col-md-offset-4 col-sm-offset-4">
         <form class="form-horizontal" name="LoginForm">
            <div class="form-group">
               <div class="col-lg-6 col-md-6 col-sm-6">
                  <input type="text" class="ejinputtext input-field col-sm-12 col-md-12 col-lg-12" ng-model="user.username" name="UserName" placeholder="Username" style="margin-bottom: 15px; margin-top: 30px;" required/>
               </div>
               <span class="error" ng-show="$root.submitted && Loginform.UserName.$error.required">Enter Username!</span>
            </div>
            <div class="form-group">
               <div class="col-lg-6 col-md-6 col-sm-6">
                  <input type="password" class="ejinputtext input-field col-sm-12 col-md-12 col-lg-12" ng-model="user.password" placeholder="Password" name="Password" required />
               </div>
               <span class="error" ng-show="$root.submitted && Loginform.Password.$error.required">Enter Password!</span>
            </div>
            <div class="checkbox">
               <label style="padding-left:0px">
               <input type="checkbox" ej-checkbox e-size= "small" >
               Remember me</label>
            </div>
            <br />
            <div class="form-group text-center">
               <div class="col-lg-6 col-md-6 col-sm-6">
                  <button  ej-button  e-size= "large" ng-click="login(user)">Log in</button>
               </div>
            </div>
            <div class="form-group text-center">
               <div class="col-lg-6 col-md-6 col-sm-6">
                  <a href="ForgetPassword.html">Request new password</a>
               </div>
            </div>
         </form>
      </div>
   </div>
</div>

JavaScript的

var app = angular.module('HRApp.controllers', ['ngStorage']);
app.controller('LoginController', function ($scope, $localStorage, $location) {

    $scope.user = {
        username: "",
        password: "",


    };

    var list = JSON.parse(localStorage.getItem('user'));
    if (list != undefined && list != '') {
        $scope.user = list;
    }

    $scope.login = function (user) {

        $scope.user.username = user.username;
        $scope.user.password = user.password;

        localStorage.setItem('Login Details', JSON.stringify($scope.user));

        var path = "layout.html";
        location.replace(path);

    };


});

如何解决此问题？

Answer 1

当给JSON.parse的值实际上undefined时，通常会看到该错误。

因此，在localStorage.getItem("user")上调用JSON.parse之前，请检查其真实值。

var list = $localStorage.getItem('user') ? JSON.parse($localStorage.getItem('user')) : undefined;

一些建议：

在HTML您已将ng-model用于input字段。

因此，您无需将user对象传递给login方法。 默认情况下，这些值将在$scope.user.username和$scope.user.password 。

因此您的login方法将变为：

$scope.login = function (user) {
        $localStorage.setItem('Login Details', JSON.stringify($scope.user)); 
        // make sure it should be Login Details / user
        var path = "layout.html";
        $location.replace(path);
    };

问题出在localStorage.getItem("user") 。 我没有在任何地方设置localStorage.setItem("user") 。 即使在登录方法中，您也具有localStorage.setItem("Login Details") 。

Answer 2

您使用变量localStorage而不是$localStorage 。 解决此问题，并告诉我们是否有错误。

location var的问题相同（必须为$location ）。