ASP.NET MVC下使用AngularJs语言(一):Hello you…

2018-06-22 06:19:10来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

新春节后,分享第一个教程。

是教一位新朋友全新学习ASP.NET MVC下使用语言。

一,新建一个空的Web项目。使用NuGet下载和jQuery。
二,配置BundleConfig.cs:


public class BundleConfig
    {
        // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            //bundles.Add(new StyleBundle("~/bundles/css").Include(
            //            "~/Content/css/angularvalidate.css"
            //            ));

            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-3.1.1.js"
                        ));

            bundles.Add(new ScriptBundle("~/bundles/angular").Include(
               "~/Scripts/angular.js",
               "~/Scripts/angular-route.js"
               ));
        }
    }
Source Code


三,配置Global.asax。编写Application_Start()方法,启用上面bundles的angularjs和jQuery引用。

 

public class MvcApplication : System.Web.HttpApplication
    {
        protected void Application_Start()
        {
            AreaRegistration.RegisterAllAreas();
            FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
            BundleTable.EnableOptimizations = true;
            BundleConfig.RegisterBundles(BundleTable.Bundles);
            RouteConfig.RegisterRoutes(RouteTable.Routes);
        }
    }
Source Code


四,项目使用ASP.NET MVC框架Layout:

 

五,为ASP.NET MVC创建一个控制器:

 

六,在项目下,创建一个angularjs目录,将用来存储angularjs代码文档,如app或controller等。下面新建一个app.js



七,为ASP.NET MVC创建一个视图:

上面html程序中,有使用了ng-app,ng-model和ng-bing等指令,实际说明,可以官方解释。

下面演示一下程序运行交互情形:

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:一步一步创建ASP.NET MVC5程序[Repository+Autofac+Automapper+S

下一篇:ASP.NET没有魔法——ASP.NET MVC 模型绑定解析(下篇)