在服务器(AngularJS)上运行时,JS文件的类型错误

时间:2014-12-16 20:54:50

标签: javascript jsp

我还是Angular的新手,我正在尝试做的是在一个单独的js文件中创建一个角度控制器并将其映射到我的jsp文件。问题是我无法获得棱角分明的工作。虽然如果我将控制器脚本包含在jsp文件本身中,它可以正常工作。不知何故,服务器无法找到这些脚本文件,它会抛出404错误。不过我在我看来正确指定了文件路径。

以下是截图:

enter image description here

这是我的家.jsp:

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html ng-app="vApp">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Home</title>

    <script type="application/javascript"           src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="application/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js"></script>
    <script type="text/javascript" src="WEB-INF/angular/app.js"></script>
    <script type="text/javascript" src="WEB-INF/angular/UsersController.js"></script>

</head>
<body >
    <h1>Hello World!</h1>
    <p>This is the homepage!</p>

    <div ng-controller="Hello as first">
        <h1>Supposed to be cool</h1>
        <p>The ID is {{first.id}}</p>
        <input type="text" ng-model="first.content">
        <p>The content is {{first.content}}</p>
    </div>

</body>

这种类型的东西可能是个问题吗?如果没有,为什么找不到这些文件?

提前完成。

修改 服务器端代码: 调度员的servlet:

<beans xmlns="http://www.springframework.org/schema/beans"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xmlns:context="http://www.springframework.org/schema/context"
   xmlns:p="http://www.springframework.org/schema/p" xmlns:tx="http://www.springframework.org/schema/tx"
   xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
    http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd
    http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd">


<context:component-scan base-package="vermilion.calendar.controller" />
<context:component-scan base-package="vermilion.calendar.model" />
<context:component-scan base-package="vermilion.calendar.service" />
<context:component-scan base-package="vermilion.calendar.dao" />


<bean id="propertyConfigurer"
      class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">

    <property name="location" value="resources/jdbc.properties"/>
</bean>

<tx:annotation-driven transaction-manager="transactionManager" />

<bean id="transactionManager"
      class="org.springframework.orm.hibernate3.HibernateTransactionManager">
    <property name="sessionFactory" ref="sessionFactory" />
</bean>

<bean
        class="org.springframework.web.servlet.view.InternalResourceViewResolver">
    <property name="prefix" value="/"/>
    <property name="suffix" value=".jsp"/>
</bean>

<bean id="dataSource"
      class="org.springframework.jdbc.datasource.DriverManagerDataSource">
    <property name="driverClassName" value="${jdbc.driver}" />
    <property name="url" value="${jdbc.url}" />
    <property name="username" value="${jdbc.username}" />
    <property name="password" value="${jdbc.password}" />
</bean>


<bean id="sessionFactory"
      class="org.springframework.orm.hibernate3.LocalSessionFactoryBean" p:dataSource-ref="dataSource">
    <property name="hibernateProperties">
        <props>
            <prop key="sessionFactory.hibernateProperties">${hibernate.dialect}</prop>
            <prop key="hibernate.transaction.factory_class">${hibernate.transaction.factory_class}</prop>
        </props>
    </property>


</bean>

HomeController中:

package vermilion.calendar.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Qualifier;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import vermilion.calendar.service.UserService;

@RestController
@RequestMapping("/")
public class HomeController {

@Qualifier("userService")
@Autowired
public UserService userService;




@RequestMapping(method = RequestMethod.GET)
public String printWelcome(ModelMap model) {

    model.addAttribute("message", "Spring 3 MVC Hello World");
    //return "login";
    return "home";
}

@RequestMapping(value = "/hello", method = RequestMethod.GET)
public String listUsers() {

    return  "home";
}

}

项目结构: enter image description here

2 个答案:

答案 0 :(得分:0)

我看到的是你的路径问题。

 <script type="text/javascript" src="WEB-INF/angular/app.js"></script>
 <script type="text/javascript" src="WEB-INF/angular/UsersController.js"></script>

您可以使用$ {pageContext.request.contextPath}来获取应用程序的根路径。

 <script type="text/javascript" src="${pageContext.request.contextPath}/WEB-INF/angular/app.js"></script>
 <script type="text/javascript" src="${pageContext.request.contextPath}/WEB-INF/angular/UsersController.js"></script>

或使用JSTL c:url

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<script type="text/javascript" src="<c:url value='/WEB-INF/angular/app.js'/>"></script>
<script type="text/javascript" src="<c:url value='/WEB-INF/angular/UsersController.js'/>"></script>

答案 1 :(得分:0)

由于我没有找到任何合理的解决方案,我最终创建了一个新项目,但这次我创建了一个简单的web动态项目(不是maven),后来转换为maven。还添加了一个

<welcome-file>

到web.xml以及我用过的

<servlet-mapping> <servlet-name>vermilion</servlet-name> <url-pattern>*.html</url-pattern> </servlet-mapping>

而不是

<servlet-mapping> <servlet-name>vermilion</servlet-name> <url-pattern>/</url-pattern> </servlet-mapping>

我不确定这些动作中的哪一个完成了工作以及实际上哪些错误,但现在它适用于角度控制器。

感谢您的所有答案。