2014-03-13 118 views
1

我想使用Angular.JS来实现多个联系表单,但不知道如何保持角度的路由干扰ASP.Net的路由。如何在ASP.Net MVC 4应用程序中使用Angular视图?

我的ASP.Net MVC 4路这个样子(这是较小改变默认的项目):

namespace Angular_Test 
{ 
    public class RouteConfig 
    { 
     public static void RegisterRoutes(RouteCollection routes) 
     { 
      routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); 

      routes.MapRoute(
       name: "Default", 
       url: "{action}", 
       defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional } 
      ); 
     } 
    } 
} 

我想我的联系页面的(位于/contactng-view DIV默认为类似(说)form.html,并有一些链接,将加载在form2.html,form3.html等,但将指向这些链接像/contact/form2完全拧与ASP.Net的路线?我应该如何去实施这个?

回答

1

你必须确保映射到角视图中的所有网址都通过相同的途径在服务器上进行处理(即服务器应该返回/contact如果得到请求,要么/contact/contact/form1/contact/form2等)

+0

ASP.Net的路线应该如何? 'url:“{action}/*”'(是一个有效的路线)?另外 - 谢谢你的答案! – drewwyatt

+1

我认为'{action}/{* pathInfo}'应该可以工作。 '{* whatever}'会在'{action}'之后捕获任意数量的段。在你的情况下,我会创建一个'联系/ {* pathInfo}模式的路线 –

1

我用'/ partials'作为我的角度视图路由的前缀。它看起来像这样。

routes.MapRoute(
    "DefaultPartials", 
    "partials/{controller}/{action}/{id}", 
    new { id = UrlParameter.Optional}); 

现在记住的是,这种做法会造成局部视图去完成整个页面的生命周期,但我用剃刀谐音为我的网页文字进行本地化,所以这是正常的我的使用。

然后,我在我的应用程序中使用区域从Web API控制器中吐出JSON数据以便消耗角度。保持事情的美好和整洁。希望这可以帮助。

我差点忘了。您需要在RouteConfig.cs中的标准默认路由之前放置partials路由。

+0

我感谢你的回答!这并不符合我在这里的确切用例(因为重载),但这对于将来肯定会有所帮助,并且是组织这个的一个超级好方法。谢谢! – drewwyatt

+0

另一个关于使用剃刀进行角度偏斜的好处的说明。您可以为您的表单和客户端验证创建angularjs html助手。我相信你已经发现输入一个角度表单元素和伴随的验证字段可能相当麻烦。剃刀帮手将这段时间缩短了一半,并允许您使用验证框架,如FluentValidation。 – trevorc

相关问题