如何在 Angularjs 中处理静态 url 锚点

debugcn 发表于 Dev

鲁斯兰·斯卡尔丁

例如，当你输入一个 URL 时如何处理这种情况，http://localhost/#!/somepage/但问题是 AngularJS 不处理它并且不加载页面，否则如果你somepage通过索引文件它可以正常工作。

我使用ui-router并且我的路由脚本如下所示：

angular.module('WEBAPP', ['ui.router', 'bw.paging'])
    .config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
        $urlRouterProvider.when('', '/');

        var states = [
            {
                name: 'home',
                url: '/',
                templateUrl: 'application/partials/home_header.html'
            },

            {
                name: 'somepage',
                url: 'somepage/',
                templateUrl: 'application/partials/somepage.html',
            },

            {
                name: '404',
                url: '404/',
                templateUrl: 'application/partials/404.html'
            },

        ]

        states.forEach(function (state) {
            $stateProvider.state(state);
        });
    });

我想要如何进行正确的路由，当我在浏览器中输入 url http://localhost/#!/somepage/AngularJS时，AngularJS 会自动重定向到该页面。

萨奇拉·拉纳瓦卡

尝试不使用 for each。我可能是错的，但我认为当你在这里使用 for each 时，只有最后一个状态会绑定 $stateprovider 而不是绑定所有状态。像这样试试。

$urlRouterProvider.otherwise('/');
$stateProvider
    .state('home', {
        url: '/',
        templateUrl: 'application/partials/home_header.html'
    })
    .state('somepage', {
        url: 'somepage/',
        templateUrl: 'application/partials/somepage.html',
    })
    .state('404', {
        url: '404/',
        templateUrl: 'application/partials/404.html'
    })

已编辑

改变网址这个 url: 'somepage/'

对此 url: '/somepage'

当你打电话时删除!url.just中的标记http://localhost/#/somepage就足够了。

var states = [
            {
                name: 'home',
                url: '/',
                templateUrl: 'application/partials/home_header.html'
            },

            {
                name: 'somepage',
                url: '/somepage',
                templateUrl: 'application/partials/somepage.html',
            },

            {
                name: '404',
                url: '/404',
                templateUrl: 'application/partials/404.html'
            },

        ]

        states.forEach(function (state) {
            $stateProvider.state(state);
        });

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。