角4使用角度cli和ASP.Net的集成MVC5

我正在嘗試使用角4和MVC 5構建混合應用程序。我已經使用angular-cli生成角4結構。大部分我是互聯網無論是在看到單證的顯示角4使用角度cli和ASP.Net的集成MVC5

手動的方式來集成或
整合MVC 5。

手動集成顯示使用systemjs，而最新的角度cli不生成它，因爲它被webpack取代。有人可以分享一個例子，讓我指導做這件事，因爲我是新角色。

來源

2017-06-08 Tom

你只需要照顧路線，並在HomeController的一些修改使用角CHTML文件作爲默認視圖：

1）使用「ng build」對角CLI項目

產生DIST文件夾（生產）

2）你的角度dist文件夾複製到項目並將其重命名爲你喜歡什麼

3）創建一個新的chtml file在View -> Home文件夾命名爲ngApp.chtml

4）複製你已經複製項目到ngApp.chtmlindex.html文件的文件夾dist內容一定是這樣的：在App_Start文件夾中的RoutingConfig.cs

@{ 
Layout = null; 
} 

<!doctype html> 
<html lang="en"> 

<head> 
<meta charset="utf-8"> 
<title>IchartApp</title> 
<base href="/"> 
<link rel="icon" type="image/x-icon" href="favicon.ico"> 
</head> 

<body> 
<app-root>Loading...</app-root> 
<script type="text/javascript" src="~/ngApp/inline.bundle.js"></script> 
<script type="text/javascript" src="~/ngApp/polyfills.bundle.js"></script> 
<script type="text/javascript" src="~/ngApp/scripts.bundle.js"></script> 
<script type="text/javascript" src="~/ngApp/styles.bundle.js"></script> 
<script type="text/javascript" src="~/ngApp/vendor.bundle.js"></script> 
<script type="text/javascript" src="~/ngApp/main.bundle.js"></script> 
</body> 

</html>

5），你需要使Attribute Routes：

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

     //Add this to Enable Angular Routing 
     routes.MapMvcAttributeRoutes(); 

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

6）打開HomeController.cs來更新默認路由：

public class HomeController : Controller 
{ 
    [Route("")] //Specify default route 
    public ActionResult Index() 
    { 
     return View("NgApp"); //Use NgApp.chtml View instead of index.chtml of HomeContoller 
    } 
//Specify other Angular Routes 
    [Route("company")] 
    [Route("login")] 
    [Route("overview")] 
    public ActionResult AppBookmarkableRoutes() 
    { 
     return View("NgApp"); 
    } 
}

7）按F5查看與Asp.net MVC集成的角度應用程序

來源

2017-07-11 07:44:13 Adnan

角4使用角度cli和ASP.Net的集成MVC5

回答

相關問題