Angularjs Javascript MVC Framework _angularjs

Source: Internet
Author: User
Tags event listener

In June, Google released the Angularjs 1.0 Stable Edition,

and claim: ANGULARJS allows you to extend the syntax of HTML to clearly and succinctly represent the components in your application, and to allow standard HTML to be your template language, Angularjs can automatically from owning JavaScript via bidirectional data binding Synchronizes data in the UI (view) of the (model).

Start Contact Angularjs is in April to the new project team, when Angularjs is still in the 0.8 unstable version, the project has been used, and this framework has been applied to the entire UI side of the project, the server is also an unstable web API, really admire the courage of the team, the enthusiasm for the new technology , fortunately, we all have a good ride, this is the first time to try a project full of unstable technology.

Back to the point, first look at an official example:

<!doctype html>
 
 

Demo:

Your Name:

--------------------------------------------------------------------------------

Hello world!

Note: Entering any character in the input box will immediately bind to the update to the page.

1. The Ng-model instruction (Directive) binding here is the Model scope property yourname.

2. And use an expression to bind yourname to the text message.

3. This only requires any DOM time listening because the ANGULARJS is built in.

ANGULARJS program is divided into 3 parts: templates, Presentation layer logic, data (model).

Templates: The UI View Code we write with Html,css, which contains angularjs directives, expressions, and is eventually compiled by the ANGULARJS compilation mechanism to append to the DOM tree. The ANGULARJS instruction (Directive) can be extended freely by us.

Presentation layer logic: Includes application logic and behavior. Use JavaScript definition as the View controller logic. In Angularjs as the MVC framework, we don't need to add the DOM-level event listener in the controller, which is already built into the ANGULARJS. After the UI node DOM event occurs, Angularjs automatically transfers to a behavior (action) logic on the scope.

Data: The View object (ViewObject) needs to be referenced by Angularjs Scope (1.0 as a service), allowing any type of JavaScript object, array, base type, object. and Angularjs automatically updates the model asynchronously by automatically refreshing the model (mode) When the UI changes, and automatically refreshing the UI when the model changes. Here we don't need to define some column methods like Getter,setter.

The following is an official view:

At the same time, ANGULARJS provides us with a number of useful services for the column, and allows us to add our own business-specific service offerings, providing low-level Ajax, caching, URL routing, browser abstraction services, And these services we can use any combination of ANGULARJS injection mechanisms. At the same time, Angularjs is also a highly testable JavaScript framework, and you can see that in the official case there is a test program that gives the BDD (behavior-driven) development framework.

The above is a small set to introduce the Angularjs Javascript MVC Framework, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.