Question

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

我猜我需要添加另一个局部视图（例如_NewView.cshtml），我可以通过添加@html.Partial（“_ NewView”）在Index.cshtml视图中引用它。我需要执行哪些其他步骤才能为视图创建视图模型，应用该视图模型，导航到新视图等。

Answer 1

经过一番乱搞之后，我发现了它。以下是将另一个视图添加到ASP.NET SPA项目的步骤。

在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 -->

将@ Html.Partial（＆＃34; _NewView＆＃34;）添加到Index.cshtml文件中。

在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

在＆＃39;〜/ bundles / app＆＃39;中添加新视图的VM代码。 App_Start.BundleConfig.cs中的ScriptBundle

那就是它。如果您想在菜单中添加指向新视图的链接，只需添加

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

到菜单列表。

如何向ASP.NET SPA项目添加新视图？

1 个答案: