0

我是新角度和它的UI路由。我的index.jsp有一個鏈接來呈現home.jsp在<div ui-view></div>。雖然我能夠看到我的索引頁面,但是當我點擊主頁選項卡時,沒有任何事情發生。即;我認爲home.jsp是index.jsp的子視圖,但無法在索引頁面內路由它。登錄後我重定向頁面使用此登錄服務工廠$window.location.href = 'http://localhost:8080/Employee/index';裏面index.jsp和我的index.jsp only.Here定義我的ng-app是我的代碼...angularjs UI路由器沒有路由.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',和評論上面,我剛開g 404錯誤說沒有找到像http://localhost:8080/views/index.jsp

我的頁面控制器

@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/"); 

    }  
} 

注:角控制檯沒有顯示任何錯誤,但針對home.jsp路由沒有發生。 請讓我知道我在哪裏做錯了,或者請給我建議任何其他參考,以實現我的需要。提前致謝。

回答

1

因爲您在ur索引中使用單個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" 
}) 

希望這會幫助你。