【问题标题】:Browser address will not be displayed correctly in ui-route浏览器地址在ui-route中将无法正确显示
【发布时间】:2014-09-19 03:50:18
【问题描述】:

我正在使用以下示例:

http://angular-ui.github.io/ui-router/sample/#/

上例中的默认页面 URL:

 http://angular-ui.github.io/ui-router/sample/#/

但对我来说是这样的:

 http://localhost:25768/Admin#/

为什么?

应该是这样的:

 http://localhost:25768/Admin/#/

注意:Admin 是 MVC 中的控制器。

我的代码:

app.js:

angular.module('uiRouterApp', [
        'uiRouterApp.home',
        'ui.router',
        'ngAnimate'
    ])
    .run(
        [
            '$rootScope', '$state', '$stateParams',
            function($rootScope, $state, $stateParams) {
                $rootScope.$state = $state;
                $rootScope.$stateParams = $stateParams;
            }
        ]
    )
    .config(
        [
            '$stateProvider', '$urlRouterProvider',
            function($stateProvider, $urlRouterProvider) {
                $urlRouterProvider
                    .when('/c?id', '/contacts/:id')
                    .when('/user/:id', '/contacts/:id')
                    .otherwise('/');
            }
        ]
    );

home.js:

angular.module('uiRouterApp.home', [
        'ui.router'
    ])
    .config(
        [
            '$stateProvider', '$urlRouterProvider',
            function($stateProvider, $urlRouterProvider) {
                $stateProvider
                    .state('home', {
                        url: '/',
                        templateUrl: 'Scripts/ui-route/home/home.html',
                    });
            }
        ]
    );

布局:

<!DOCTYPE html>

<html ng-app="uiRouterApp">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

    <title ng-bind="$state.current.name + ' - ui-router'">@ViewBag.Title</title>

</head>
<body class="container adminBackground">
    <div class="min1170px">
        <div class="adminHeader">
            <img class="adminLeftLogoHeader" src="/Images/juventusLogo.png" />
            <img class="adminRightLogoHeader" src="/Images/apkAndroid.png" />
            <div class="adminTitleHeader">

            </div>
        </div>
        <nav class="navbar navbar-inverse" role="navigation">
            <div class="navbar-header">
                <a class="navbar-brand" ui-sref="home">Main</a>
            </div>
            <div id="navbarMenuHeader">
                <ul class="nav navbar-nav">
                    <li><a href="#">Exit</a></li>
                </ul>
                <ul class="nav navbar-nav navbar-left">
                    <li><a href="#"> @User.Identity.Name</a></li>
                </ul>
            </div>
        </nav>
        <div id="body">
            @RenderSection("featured", required: false)
            <section>
                @RenderBody()
            </section>
        </div>
    </div>
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/angularJs")
    @RenderSection("scripts", required: false)
</body>
</html>

管理控制器中的索引页面:

@{
    ViewBag.Title = "Manager";
    Layout = "../Shared/_AdminLayout.cshtml";
}

更新:

当 url 为:http://localhost:25768/Admin

并且网址更改为:

http://localhost:25768/Admin#/

没有错误,它可以工作。但网址是http://localhost:25768/Admin#/ !!!!不好

当 url 为:localhost:25768/Admin/

所以网址更改为:

http://localhost:25768/Admin/#/

角度错误:

GET http://localhost:25768/Admin/Scripts/ui-route/home/home.html 404 (Not Found) 

【问题讨论】:

    标签: asp.net-mvc angularjs angular-ui-router


    【解决方案1】:

    问题出在 ASP.NET MVC 方面...我们必须确定,

    • 浏览器将使用斜杠
    • 或重定向它,如果不是...

    这应该是您的索引操作的内容

    public ActionResult Index()
    {
        var root = VirtualPathUtility.ToAbsolute("~/");
        var applicationPath = Request.ApplicationPath;
        var path = Request.Path;
    
        var hasTraillingSlash = 
              root.Equals(applicationPath, StringComparison.InvariantCultureIgnoreCase)
           || !applicationPath.Equals(path, StringComparison.InvariantCultureIgnoreCase);
    
        if (!hasTraillingSlash)
        {
            return Redirect(root + "#");
        }
    
        return View();
    }
    

    查看此问答:

    【讨论】:

    • 我一直在使用你的代码。但它没有用。当 url= 'localhost:25768/Admin#' => root ="/" 和 applicationPath ="/" 和 path ="/Admin" 时。所以有TraillingSlash = true。
    • 嗯,网址是localhost:25768/Adminlocalhost:25768/Admin/ 最后没有哈希...浏览器永远不会将哈希后的部分发送到服务器。因此,带有或不带有斜杠的网址将到达服务器...此代码对我(我们)有效...换句话说:我是说,如果您正确应用我的 sn-p,它将正确重定向到 /Admin/ ... 总是
    • 所以,问题是另一种类型...我一直错误地期望Admin是虚拟应用程序...不是 一个控制器。如果是这样的话,以上就足够了。但是因为管理员是控制器,它在 url 中带来了另一个深度..不需要一个。您应该确保将localhost:25768/ 用于您的索引操作。 IE。它应该是 Home Controller 及其操作 Index... 或者只是更改 url 路由设置(默认是 Admin 而不是 Home)... 这两个 thinkg(MVC 的相对路径和 url 路由)不能一起工作...跨度>
    • 这个答案对我有用。它在 localhost 上运行良好,但是当推送到我们的服务器时,它停止工作。现在使用这个答案可以正常工作。非常感谢!!
    【解决方案2】:

    首先,我将 templateUrl 更改为

     templateUrl: '/Scripts/ui-route/home/home.html',
    

    然后,我将代码更改如下:

          public ActionResult Index()
            {
                var path = Request.Path;
    
                if (path == "/Admin")
                {
                    return Redirect("/Admin/");
                }
    
                return View();
            }
    

    有效。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-06-12
      • 2017-12-20
      • 1970-01-01
      • 2012-08-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多