angluarjs2项目生成内容合并到asp.net mvc4项目…
2018-06-22 07:43:31来源:未知 阅读 ()
-
应用场景
angular2(下文中标注位NG2)项目和.net mvc项目分别开发,前期采用跨域访问进行并行开发,后期只需要将NG2项目的生产版本合并到.net项目。
-
NG2项目概述
-
ng2项目采用的是angular-cli搭建的框架。
-
使用type script、rxjs等内容开发。
-
.net mvc 项目概述:
-
前期开发阶段,去除了验证内容,并支持跨域(这里没有使用api)。
-
后期需要与ng2的发布内容进行整合。
-
具体步骤(只说明.net mvc中的操作内容)
- 路由内容设置
-
//防止用户刷新路由指向错误 routes.MapRoute( name: "ngdefault", url: "content/dist/{*.}", defaults: new { controller = "Home", action = "Index" } ); //原NG2开发框架中的调用内容 routes.MapRoute( name: "MyRoute", url: "api/{controller}/{action}" ); //正常的页面请求 routes.MapRoute( name: "Default", url: "{controller}/{action}/{*pathInfo}", defaults: new { controller = "Home", action = "Index"} );
-
页面设置(以下为我的Home控制器Index对应的页面内容)
-
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> <base href="/content/dist/"> </head> <body> <app-root></app-root>
@* 以下内容要根据你的NG2项目的生成内容来设置,具体请参照你的NG2项目引导页面的内容。 *@ <script type="text/javascript" src="~/content/dist/inline.js"></script> <script type="text/javascript" src="~/content/dist/styles.41c78f28e60ca8b5fd69.bundle.js"></script> <script type="text/javascript" src="~/content/dist/scripts.bc1943ee0f025606a729.bundle.js"></script> <script type="text/javascript" src="~/content/dist/main.2ad5580a0f71e9dcee3e.bundle.js"></script> </body> </html> -
NG2项目放置位置
发布内容放到content目录下,所以index页面需要在head中设置<base href="/content/dist/">。
-
实现内容
-
ng2的路由可以正确使用
-
再刷新页面等操作时,mvc的路由能正确引导NG2的路由。不会出现无法访问页面的错误。
有其他更好的方法去操作,还请园友不吝赐教,再此谢过。
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
- .NET随机数函数的生成方法 2020-03-18
- ASP.NET实现进度条效果 2020-03-15
- WPF实现定时刷新UI界面功能 2020-03-14
- .Net项目中一些常用验证操作 2020-02-27
- ASP.NET编程简单实现生成静态页面的方法 2020-02-06
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash