4

我在 Visual Studio 2013(更新 1)中创建了一个新的 ASP.NET SPA(单页应用程序)项目,并将所有 NuGet 库更新为截至 2014 年 4 月 12 日可用的最新版本。我需要执行哪些步骤才能将另一个视图添加到默认项目?我还想在顶部导航栏中添加指向新视图的链接。

我猜我需要添加另一个局部视图(比如_NewView.cshtml),我可以通过添加@html.Partial("_NewView") 在Index.cshtml 视图中引用它。为了为视图创建视图模型、应用该视图模型、导航到新视图等,我还需要执行哪些其他步骤?

4

1 回答 1

4

经过一番折腾,我想通了。以下是将另一个视图添加到 ASP.NET SPA 项目的步骤。

  1. 在 Views.Home 文件夹中创建一个新的局部视图 (_NewView.cshtml)。这是一个简单的例子。

    <!-- ko with: newview -->
    <div class="jumbotron">
    <h1>New View</h1>
    <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS, and JavaScript.</p>
    <p><a href="http://asp.net" class="btn btn-primary btn-large">Learn more &raquo;</a></p>
    </div>
    <!-- /ko -->
    
  2. 将 @Html.Partial("_NewView") 添加到 Index.cshtml 文件中。

  3. 在 Scripts.app 文件夹中为新视图创建一个视图模型 js 文件。至少您需要向 App VM 注册新视图。以下是所需的最低要求(用 CoffeeScript 编写):

    NewViewModel = (app, dataModel) ->
      self = this
      return
    
    # NewViewModel currently does not require data binding, so there are no visible members.
    app.addViewModel
      name: "NewView"
      bindingMemberName: "newview"
      factory: NewViewModel
    
  4. 在 App_Start.BundleConfig.cs 的“~/bundles/app”ScriptBundle 中包含新视图的 VM 代码

而已。如果您想在菜单中添加指向新视图的链接,只需添加

      <li><a href="#" data-bind="click: navigateToNewview">New View</a></li>

到菜单列表。

于 2014-04-13T16:03:57.580 回答