Question

我正在关注本教程，www.youtube.com / watch？v = 5HpyqG0pK4Q。在MVC 4应用程序中创建移动视图。我按照视频跟踪了所有内容，但无法获得Index.phone.cshtml视图以使用_Layout.phone.cshtml。是因为我使用VS2010而不是2012年？或者因为它是jquery mobile的旧版本？我不得不手动添加jquery.mobile-1.4.2.min.css。还是有一个我没有看到的明显答案？

我的Global.asax.cs文件 -

     public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();

        WebApiConfig.Register(GlobalConfiguration.Configuration);
        FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        IntializeBundles();
        BundleConfig.RegisterBundles(BundleTable.Bundles);
        AuthConfig.RegisterAuth();


        IntializeDisplayModeProviders();
    }

    protected void IntializeBundles()
    {
        var phoneScripts = new ScriptBundle("~/bundles/MobileJS")
        .Include("~/Scripts/jquery.mobile-1.*",
                "~/Scripts/jquery 1.*");

        var phoneStyles = new StyleBundle("~/bundles/MobileCSS")
            .Include("~/Content/jquery.mobile-1.4.2.min.css",
                    "~/Content/jquery.mobile.structure-1.4.2.min.css",
                    "~/Content/jquery.mobile.theme-1.4.2.min.css");

        BundleTable.Bundles.IgnoreList.Clear();
        BundleTable.Bundles.Add(phoneScripts);
        BundleTable.Bundles.Add(phoneStyles);

    }

    protected void IntializeDisplayModeProviders()
    {
        var phone = new DefaultDisplayMode("Phone")
        {
            ContextCondition = ctx => ctx.GetOverriddenUserAgent() != null && ctx.GetOverriddenUserAgent().Contains("iPhone")
        };

        var tablet = new DefaultDisplayMode("Tablet")
        {
            ContextCondition = ctx => ctx.GetOverriddenUserAgent() != null && ctx.GetOverriddenUserAgent().Contains("iPad")
        };

        DisplayModeProvider.Instance.Modes.Insert(0, phone);
        DisplayModeProvider.Instance.Modes.Insert(1, tablet);
    }
}

}

我的_Layout.phone.cshtml -

   <head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />

     @Styles.Render("~/bundles/MobileCSS")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/MobileJS")

</head>

我的Index.phone.cshtml -

  @{
ViewBag.Title = "Home Page";
Layout = "../Shared/_Layout.Phone.cshtml";
 }
    <h1>This is a phone</h1>

为什么jquery.mobile-1.4.2.min.css适用于_Layout.mobile.cshtml？

0 个答案: