zoukankan      html  css  js  c++  java
  • [AngularJS 1] Introduction to AngularJS

    introduction:this article is going to introduce AngularJS in generally. I will write it through five points.Number one is what is AngularJS.Number two is why use Angular.Number three is how angularJS works.Number four is about modules.Number five is my own summery.


    Number one_what is it

    Front -end javascript framework for creating web applications;

    Open source maintained by Google;

    MVC pattern

    Handles common(and ofter trying tasks) such as DOM manipulation,updating UI based on data or input, registering callbacks;

    Decarative programming


    Number two_why use it

    Good for dynamic web sites/web apps(VRUD based);

    Framework imposes a structure that is good for organizetion;

    Helps create responsive(fast) websites;

    Easy to test-to create software that is easily maintained;


    Number three_how it works

    AngularJS will initialize when the DOM content is loaded;

    Looks for the ng-app directive-if its found,that is the root of the app;

    Directives can be declared a variety of ways:typically with the ng-prefix,but you can use data-ng;

    It will load the module associated with the directive if specified;


    PS: what is the difference between ng-prefix and data-ng? ok, when your brower's version is old, maybe you should use data-ng!


    Number four_modules

    what are modules? 

    It's containers for the various parts of your application(controllers,services etc). It's declarative-easy to understand. It's maintainable,readable,testable. It defines dependencies for our app.

    Modules setup: A module is comprised of configuration and run blocks. Configuration blocks-executed during configuration and registration. Only peoviders and constants can be passed. Run blocks-happen after the injector is created. Only instances and constants can be passed in and is like a main method-it kickstarts the application.


    PS:Modules can depend on other modules and they are only loaded once.


    Number five_summery

    first of all, let me show some code:

    <span style="font-family:KaiTi_GB2312;font-size:18px;"><!doctype html>
    <html ng-app>
    	<head>
    		<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
    	</head>
    	<body>
    		My name:<input type="text" ng-model="MyName" placeholder="please write down your name !">
    		<hr>
    		Hello, My name is {{MyName||''}}
    	</body>
    </html></span>
    please run the code in your brower, then there is surprise for you.


    I gonna publish my blog in english, Maybe it's not good at the beginning, but it's okay . the next blog is about Angular Controllers!


  • 相关阅读:
    JVM系列【2】Class文件结构
    JVM系列【5】JVM常用指令
    JVM系列【4】内存模型
    JVM系列【3】Class文件加载过程
    新编html网页设计从入门到精通 (龙马工作室) pdf扫描版​
    HTML5移动开发即学即用(双色) 王志刚 pdf扫描版​
    HTML5和CSS3实例教程 中文版 高清PDF扫描版
    HTML5+CSS3网站设计教程 (张晓景,胡克) [iso]
    HTML5+CSS3+jQuery Mobile轻松构造APP与移动网站 (陈婉凌) 中文pdf扫描版
    HTML5 Canvas游戏开发实战 PDF扫描版
  • 原文地址:https://www.cnblogs.com/hhx626/p/6010338.html
Copyright © 2011-2022 走看看