Asp.net mvc Sammy.js路由无限循环_Asp.net Mvc_Model View Controller_Asp.net Mvc 5_Single Page Application_Sammy.js

Asp.net mvc Sammy.js路由无限循环

asp.net-mvc model-view-controller asp.net-mvc-5

Asp.net mvc Sammy.js路由无限循环,asp.net-mvc,model-view-controller,asp.net-mvc-5,single-page-application,sammy.js,Asp.net Mvc,Model View Controller,Asp.net Mvc 5,Single Page Application,Sammy.js,我正在努力实现在我的ASP.NET MVC应用程序中我将只突出显示_Layout.cshtml中的代码 <div id="body"> @RenderSection("featured", required: false) <section id="page" class="content-wrapper main-content clear-fix"> @RenderBody() </s

我正在努力实现在我的ASP.NET MVC应用程序中

我将只突出显示_Layout.cshtml中的代码

 <div id="body">
        @RenderSection("featured", required: false)
        <section id="page" class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>
    <footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; @DateTime.Now.Year - My ASP.NET MVC Application</p>
            </div>
        </div>
    </footer>

    @*@Scripts.Render("~/bundles/jqueryui")*@
    @Scripts.Render("~/js/mvc-spa")
    <script>
        $(function () {
            var routing = new Routing('@Url.Content("~/")', '#page', '');
            routing.init();
        });
    </script>

}

如果我转到/#/about或/#/contact（如git hub中的示例应用程序），一切看起来都很好，但当导航到我的应用程序页面的#/（根路径）时，会被反复调用

发生了什么事

我问自己的另一个问题是如何处理404错误

当我去/#/nosuchurl的时候有点晚了，但我希望这对某人有帮助

我想问题在于，您正在将整个索引加载为一个视图，其中包含布局中的所有内容（脚本、css等）

我也在使用Sammy.js和MVC web app进行测试，这是可行的：

_布局：

<body>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="#/Home/_Index">Home</a></li>
                <li><a href="#/Home/About">About</a></li>
                <li><a href="#/Home/Contact">Contacto</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="container body-content" id="page">
    @RenderBody()
    <hr />
    <footer>
        <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
    </footer>
</div>

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
<script>
    $(function () {
        var routing = new Routing('@Url.Content("~/")', '#page', '');
        routing.init();
    });
</script>

以及GitHub中示例附带的路由文件：

var Routing = function (appRoot, contentSelector, defaultRoute) {

function getUrlFromHash(hash) {
    var url = hash.replace('#/', '');
    if (url === appRoot)
        url = defaultRoute;
    return url;
}

return {
    init: function () {
        Sammy(contentSelector, function () {
            this.get(/\#\/(.*)/, function (context) {
                var url = getUrlFromHash(context.path);
                context.load(url).swap();
            });
        }).run('#/');
    }
};}

public class HomeController : Controller {
    public ActionResult Index() {
        return View();
    }

    public ActionResult _Index() {
        return PartialView();
    }

    public ActionResult About() {
        ViewBag.Message = "Your application description page.";

        return PartialView();
    }

    public ActionResult Contact() {
        ViewBag.Message = "Your contact page.";

        return PartialView();
    }
}

var Routing = function (appRoot, contentSelector, defaultRoute) {

function getUrlFromHash(hash) {
    var url = hash.replace('#/', '');
    if (url === appRoot)
        url = defaultRoute;
    return url;
}

return {
    init: function () {
        Sammy(contentSelector, function () {
            this.get(/\#\/(.*)/, function (context) {
                var url = getUrlFromHash(context.path);
                context.load(url).swap();
            });
        }).run('#/');
    }
};}