我是 Angular 及其 UI 路由的新手。我的index.jsp有一个渲染home.jsp的链接，位于<div ui-view></div> 。虽然我可以看到我的索引页，但当我单击主页选项卡时没有任何反应。 IE;我认为 home.jsp 是 index.jsp 的 subview ，但无法将其路由到索引页面内。登录后，我在登录服务工厂 $window.location.href = 'http://localhost:8080/Employee/index'; 中使用它将页面重定向到 index.jsp我定义了我的 ng-app仅在index.jsp中。这是我的代码...
index.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<style>
//my styles here....
</style>
<link rel="stylesheet" href="static/css/bootstrap.css" />
<link rel="stylesheet" href="static/css/app.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script src="http://angular-ui.github.io/ui-router/release/angular-ui-router.js"></script>
<script src="<c:url value='/static/js/app.js' />"></script>
<script src="<c:url value='/static/js/controller/index_controller.js' />"></script>
<script src="<c:url value='/static/js/service/index_service.js' />"></script>
<script src="<c:url value='/static/js/controller/home_controller.js' />"></script>
<script src="<c:url value='/static/js/service/home_service.js' />"></script>
</head>
<body >
<div class="container" >
<header>
<h1>Header</h1>
</header>
<div id="navbar">
<ul>
<li><a ui-sref="index.home">Home</a></li>
<li>Experiance</li>
<li>SkillSet</li>
<li>Awards</li>
</ul>
</div>
<div ui-view="_home"></div>
<hr/>
<footer>Footer</footer>
</div>
</body>
</html>
app.js
'use strict';
var App = angular.module('myApp',['ui.router']);
App.config(['$stateProvider', '$urlRouterProvider','$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider){
$urlRouterProvider.otherwise("/Employee/index");
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
$stateProvider
.state('index', {
abstract: true,
url: '/Employee/index',
views: {
'index': {
templateUrl: '/Employee/index',
// templateUrl: '/views/index.jsp',
controller : "IndexController"
}
}
}).state('index.home', {
parent:'index',
url: '/home',
views: {
'_home': {
templateUrl: '/Employee/index/home',
// templateUrl: '/views/home.jsp',
controller : "HomeController"
}
}
})
}]);
当我取消注释行 templateUrl: '/views/home.jsp', 时并评论上面的内容，我收到 404 错误，如 http://localhost:8080/views/index.jsp未找到。
我的页面 Controller
@Controller
public class BasePageController {
@RequestMapping(value="/*")
public String getDefaultPage(){
System.out.println("test default");
return "Login";
}
@RequestMapping(value="/login")
public String getLoginPage(){
System.out.println("test login");
return "Login";
}
@RequestMapping(value="/index/home")
public String getHomePage(){
System.out.println("test home");
return "home";
}
@RequestMapping(value="/index")
public String getIndexPage(){
System.out.println("test index");
return "index";
}
}
服务配置
@Configuration
@EnableWebMvc
@ComponentScan(basePackages = "com.arun.employee")
public class EmployeeConfiguration extends WebMvcConfigurerAdapter{
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
viewResolver.setViewClass(JstlView.class);
viewResolver.setPrefix("/WEB-INF/views/");
viewResolver.setSuffix(".jsp");
registry.viewResolver(viewResolver);
}
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations("/static/");
}
}
注意: Angular 控制台未显示任何错误，但 home.jsp 的路由未发生。 请让我知道我到底做错了什么，或者请建议我任何其他引用资料来满足我的需求。提前致谢。
最佳答案
当您使用单ui-view时在你的索引中。我已经删除了ui-view="_home"就做到了
<div ui-view></div> 。并在配置文件中进行了一些更改，如下所示
$stateProvider
.state('index', {
abstract: true,
url: '/Employee/index',
templateUrl: '/views/index.jsp',
controller : "IndexController"
})
.state('index.home', {
url: '/home',
templateUrl: '/views/home.jsp',
controller : "HomeController"
})
希望这对您有帮助。
关于javascript - angularjs UI-Router 不路由 .jsp View ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43490103/