Question

我在Spring MVC应用程序中使用AngularJS ngRouter。应用程序启动时，应重定向到登录页面（http://localhost:8080/TimeLee/login）。但它重定向到网址 http://localhost:8080/TimeLee/#!/ 而不是登录页面

的index.jsp

<!DOCTYPE html>
<html data-ng-app="index">
<head>
<title>Hello User</title>
<script src= "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>

    <script>

    var App = angular.module('index',[ 'ngRoute' ]);

    App.config(function($routeProvider,$locationProvider) 
    {
        $routeProvider
        .when('/login', {
        templateUrl : 'login/login',
        controller : 'loadLoginPage'
        })
        .when('/home', {
                templateUrl : 'login/home',
                controller : 'loadLoginPage'
                })
        .when('/', {
            templateUrl : 'login/',
            controller : 'loadLoginPage'
        })

        .otherwise({
            redirectTo : '/',
        });
        });

    App.controller('loadLoginPage', ['$window','$location', function($window,$location) 
    {
        //$window.location.href='http://localhost:8080/TimeLee/login/';
    }]);

   </script>
</head>

<body>
    <div data-ng-controller="loadLoginPage">            
    </div>
</body>
</html>

主要控制器：

package com.timelee.common.controllers;

import com.timelee.common.services.LoginService;
import com.timelee.users.model.User;

import java.util.HashMap;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@RequestMapping("/login")
public class MainController
{
    @Autowired
    private LoginService loginService;

    @RequestMapping(value="/login",method=RequestMethod.GET)
    public  String getLogin()
    {
        System.out.println("Inside /login");
        return "login";
    }

    @RequestMapping(value="/",method=RequestMethod.GET)
    public  String loadLoginPage()
    {
        System.out.println("Inside /");
        return "login";
    }

    @RequestMapping(value="/loginAction",method=RequestMethod.GET)
    @ResponseBody
    public ResponseEntity<HashMap> loginAction(@RequestParam("user_name") String user_name,@RequestParam("user_password") String user_password, HttpServletRequest request)
    {
        HashMap map=loginService.validateLogin(user_name,user_password);
        return  ResponseEntity.status(HttpStatus.ACCEPTED).body(map);
    }

    @RequestMapping(value="/home",method=RequestMethod.GET)
    public String redirectHome()
    {
        return "login";

    }

    @RequestMapping(value="/homepage",method=RequestMethod.GET)
    public String loadHomePage()
    {
        return "home";

    }

}

Answer 1

首先将您的其他路线更改为以下所示＆amp;删除“/”路线

.otherwise({
       redirectTo : '/login',
 });

这会将您的页面重定向到登录页面，但您的网址中仍会有＃（默认的hashbang模式）。要删除你必须在角度模块的配置块中使用$ location service的提供者，即$locationProvider.html5Mode(true);。这将重写url到简单的html5模式。 https://docs.angularjs.org/guide/$location

要为不同的路线添加模板，请遵循官方文档结构。

Answer 2

您需要了解当您使用AngularJS作为前端框架时，您将不再使用模型和版本。像使用JSP作为模板引擎时通常所做的那样。

您需要使应用程序加载索引主页，即angularJS注入其视图的页面。您将在Spring Controller和AngularJS之间使用HTTP REST进行通信。

您的实际路由和视图切换将使用#!/

在AngularJS前端进行

你得到了什么：linear snap helper 在AngularJS中完全正常，这就是AngularJS如何处理他的路线并注入其正确的请求视图。

AngularJS路由器重定向到＃！/而不是登录页面

2 个答案: