我是Angular.js的新手,我正在尝试运行一个示例Angular1.6,spring3.1.1 MVC项目。我正在使用ui-router从index.jsp.All js路由login.html和jsp文件在服务器启动时可用,但我仍然无法从index.jsp转到login.html。
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html ng-app="CM">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</meta>
<title>Expanded Navigation | Nifty - Responsive admin template.</title>
<link href="<c:url value='/static/css/bootstrap.min.css'/>" rel="stylesheet">
<link href="<c:url value='/static/css/jquery-ui.min.css'/>" rel="stylesheet">
<script src="<c:url value='/static/js/jquery.js'/>" type="text/javascript">
</script>
<script src="<c:url value='/static/js/angular.min.js'/>"
type="text/javascript"> </script>
<script src="<c:url value='/static/js/angular-ui-router.min.js'/>" type="text/javascript"> </script>
<script src="<c:url value='/static/config/config.js'/>" type="text/javascript"> </script>
<script src="<c:url value='/static/controller/loginCtrl.js'/>" type="text/javascript"> </script>
</head>
<body>
<div class="container" width="100px">
<h2>AngularJS Simple Login Example</h2>
<ui-view>
<i>Loding....</i>
</ui-view>
</div>
</body>
</html>
var app = angular.module('CM', ['ui.router']);
app.config(['$stateProvider', function($stateProviders) {
$stateProvider
.state('login', {
url : '/',
templateUrl : '/static/pages/login.html',
controller : 'loginCtrl'
});
}]);
console.log("Homepage Config loaded..");
app.config(['$qProvider', function ($qProvider) {
$qProvider.errorOnUnhandledRejections(false);
}]);
var app = angular.module('CM');
app.controller('loginCtrl', function($scope, $rootScope) {
$rootScope.title = "AngularJS Login Sample";
console.log("LoginCtrl Loded");
});
<div id='content' ng-controller='loginCtrl'>
<div class="container">
<form class="form-signin" role="form" ng-submit="login()">
<h3 class="form-signin-heading">Login Form</h3>
<span><b>Username :</b>
<input type="username" class="form-control" ng-model="user.name" required> </span> </br>
</br> <span><b>Password :</b>
<input type="password" class="form-control" ng-model="user.password" required> </span>
<br><br>
<button class="btn btn-lg btn-primary btn-block" type="submit">
<b>Sign in</b>
</button>
</form>
</div>
<!-- /container -->
</div>
@Controller
public class LoginController {
@RequestMapping(value = "/", method = RequestMethod.POST)
public void login(HttpServletRequest request, HttpServletResponse response,
@RequestParam("userName") String userName, @RequestParam("password") String password) throws IOException {
Object[] customerName = null;
System.out.println("logged in " + userName + "password " + password);
ModelAndView mod = new ModelAndView();
mod.setViewName("/campignDisplay");
}
}
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:javaee="http://java.sun.com/xml/ns/javaee"
xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd" id="WebApp_9" version="2.4">
<display-name>campaignManager</display-name>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/dispatcher-servlet.xml</param-value>
</context-param>
<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dispatcher</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener
</listener-class>
</listener>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<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:mvc="http://www.springframework.org/schema/mvc"
xmlns:task="http://www.springframework.org/schema/task"
xmlns:cache="http://www.springframework.org/schema/cache"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd
http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd">
<context:component-scan base-package="com.hp.cms.*"/>
<mvc:resources mapping="/static/**" location="/static/" />
<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF</value>
</property>
<property name="suffix">
<value>*.jsp</value>
</property>
</bean>
</beans>
真的感谢任何帮助!!
答案 0 :(得分:0)
您忘了在您的html页面中添加ng-app attr
这样做
<body ng-app="CM">
为了更好的方法,更好地使用扩展方法而不是用变量包装它。
config.js
angular.module('CM', ['ui.router']);
angular.module('CM').config(['$stateProvider', function($stateProvider) {
$stateProvider
.state('login', {
url : '/',
templateUrl : '/static/pages/login.html',
controller : 'loginCtrl'
});
}]);
console.log("Homepage Config loaded..");
angular.module('CM').config(['$qProvider', function ($qProvider) {
$qProvider.errorOnUnhandledRejections(false);
}]);
loginCtrl.js
angular.module('CM').controller('loginCtrl', function($scope, $rootScope) {
$rootScope.title = "AngularJS Login Sample";
console.log("LoginCtrl Loded");
答案 1 :(得分:0)
发布解决方案,如果它帮助别人。有角度和ui-router的版本问题。我已将Angular的版本从1.6降级到1.2并且ui-router是 0.2.18。 由于时间限制,没有花太多时间来解决问题。