将角度路由与MVC部分视图混合?

时间:2013-07-27 00:31:43

标签: asp.net-mvc angularjs routing

我想在我的大多数应用程序中使用角度模板,但对于某些页面,我想使用asp-mvc控制器和ng-view中显示的部分视图。

我一直在用路由尝试这样的事情:

when('/AccountX/Manage', { templateUrl: '/Account/Manage', controller: AccountController }).
when('/Account/Manage', { controller: AccountController }).

我还将帐户/管理表单更改为ajax,但似乎在发布表单后,角度会以get结尾。

我正在使用没有hashbang的html5Mode。我的目标是始终保持正常的网址。

有没有办法告诉棱角线避免一些路线?像aspnet MVC中的IgnoreRoute一样?

抱歉,如果我太模糊了。根据我自己的理解,我只想找到一个将标准aspnet mvc与angular混合的工作概念,无论它是好还是坏。

2 个答案:

答案 0 :(得分:1)

看起来有办法使用$ location服务来完成您的请求:

Conditionally have anchor links send user to a different page, rather than load to ng-view

答案 1 :(得分:0)

使其工作的一个重要部分似乎是避免将ng-app分配给html元素。当ng-app较小时,其外部的部分不会受路由影响。

在此过程中存在一些潜在问题:

  • ng-app无法嵌套。
  • 只有第一个ng-app会自动引导。
  • 后者ng-app改为添加如下:angular.bootstrap(element[, modules]);

http://docs.angularjs.org/api/ng.directive:ngApp
http://docs.angularjs.org/api/angular.bootstrap

当ng-app中存在不应触发角度路由的链接时,可以通过添加target="_self"(或任何目标属性)来避免这种情况。

有一个很好的项目模板可供mvc4 + angular + breeze使用,可以进行研究和测试。 (至少需要VS 2012 Update 2。)
http://www.asp.net/single-page-application/overview/templates/breezeangular-template

结论

通过在html页面中对应用程序进行分区,使得某些部分不受路由影响,并在需要时排除ng-app中的各个链接,可以成功地将Asp.NET MVC功能与AngularJS混合使用。 / p>