在AngularJS中使用ui-router时如何防止在浏览器中直接进行模板导航?

时间:2017-03-14 17:23:44

标签: angularjs angular-ui-router

以下是我的代码:

var app = angular
            .module('moviesApp', ['ui.router'])
            .config(function ($stateProvider, $locationProvider, $urlRouterProvider) {          
                $urlRouterProvider.otherwise('/SignIn');          
                $stateProvider
                    .state("SignIn", {
                        url: "/SignIn",
                        templateUrl: "Pages/SignIn.html"
                    })
                    .state("SignUp", {
                        url: "/SignUp",
                        templateUrl: "Pages/SignUp.html"
                    }); 
                $locationProvider.html5Mode(true);
            });

当我加载状态 - ' / SignIn '时,它会按预期加载 ui-view 中的“Pages / SignIn.html”内容。同样,当我加载其他状态 - ' / SignUp '时,它会在 ui-view 中加载“Pages / SignUp.html”的内容。

我的要求是什么?

我希望只能通过ui-view中的状态加载“Pages / SignIn.html”或“Pages / SignUp.html”。不应通过浏览器中的直接URL导航加载它们。

换句话说,当我直接在浏览器的地址栏中输入“ /Pages/SignIn.html ”时,应将其重定向到状态“ / SignIn ” 。

“页面”文件夹下的html文件内容不应通过直接网址导航显示。

我怎样才能做到这一点?请指教。

1 个答案:

答案 0 :(得分:0)

要阻止它显示在地址栏中,请使用名称而不是网址

    $stateProvider.state('default', {
        url:'',
        templateUrl: ctx + '/jsp/home/dashboard.jsp'
    }).state({
        name:'/test',
        templateUrl: ctx + '/jsp/home/testview.jsp'
    });

在html页面中给出如下

<a ui-sref="test">test view</a></li>