AngularJS не определено - PullRequest
0 голосов
/ 16 января 2020

Я начинаю учиться на AngularJs на начальном уровне. Мой проект используется в среде Spring Boot. Я получаю сообщение об ошибке: «ReferenceError: angular не определено». Я уже создал приложение. js, которое является определенной переменной angular, но это все еще ошибка.

app. js:

var app = angular.module('myapp', ['ngRoute']);
app.controller('mainController', ['$scope', function($scope) {
    $scope.title = "Welcome";        
}]);

welcome. jsp:

<c:set var="contextPath" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html ng-app="myapp" lang="en">
    <head>
        <meta charset="utf-8">
        <title>Create an account</title>
        <link href="${contextPath}/resources/css/bootstrap.min.css" rel="stylesheet">
        <script src="${contextPath}/resources/js/app.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-route.min.js"></script>
    </head>
    <body>
        <div class="container" ng-controller="mainController">
            <c:if test="${pageContext.request.userPrincipal.name != null}">
            <form id="logoutForm" method="POST" action="${contextPath}/logout">
                <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
            </form>

            <h2> {{ title }} ${pageContext.request.userPrincipal.name} | 
                <a onclick="document.forms['logoutForm'].submit()">Logout</a></h2>
            </c:if> 
            {{ title }}         
        </div>


        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script src="${contextPath}/resources/js/bootstrap.min.js"></script>

    </body>
</html>

Как мне решить эту проблему?

Ответы [ 2 ]

1 голос
/ 16 января 2020

Добавить angular скрипт перед вашим app.js.

Поскольку ваш app.js использует angular объект, он должен быть уже определен. angular scripts делает эту работу, поэтому она должна быть загружена перед любым кодом angular.

Попробуйте ниже

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-route.min.js"></script>
<script src="${contextPath}/resources/js/app.js"></script>        

1 голос
/ 16 января 2020

Переместите ваш скрипт ниже

<c:set var="contextPath" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html ng-app="myapp" lang="en">
    <head>
        <meta charset="utf-8">
        <title>Create an account</title>
        <link href="${contextPath}/resources/css/bootstrap.min.css" rel="stylesheet">
        
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
        
        
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-route.min.js"></script>

        <!-- move it here -->
        
        <script src="${contextPath}/resources/js/app.js"></script>
    </head>
    <body>
        ...
    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...