In June, Google released the AngularJs 1.0 stable version,
And declared that: AngularJS allows you to extend HTML syntax to clearly and concisely represent components in your application, and allows standard HTML as your template language. AngularJS can automatically synchronize data from a UI (view) with JavaScript objects (models) through two-way data binding.
I started to contact AngularJs when I came to the new project team in April. At this time, AngularJs was still in the 0.8 unstable version and it has started to be used in the project. This framework is applied to the entire UI end of the project, and the server end is also an unstable web api. I really admire the team's courage and enthusiasm for new technologies. Fortunately, everyone can control it well. This is the first time I tried a project full of unstable technologies.
Going back to the topic, let’s take a look at an official example:
<!doctype html><html ng-app><head><script src="http://code.angularjs.org/angular-...min.js"></script></head><body>Your name: <input type="text" ng-model="yourname" placeholder="World"><hr>Hello {{yourname || 'World'}}!</body></html>Demo:
Your name:
--------------------------------------------------------------------------------------------------------------------------------
Hello World!
Note: Entering any character in the input box will immediately bind to the update to the page.
1. Here, the ng-model directive (directive) binding is the model scope attribute yourname.
2. And use expressions to bind yourname to text information.
3. Only any dom time listening is needed here, because AngularJs is built-in.
AngularJs program is divided into 3 parts: template, presentation layer logic, and data (model).
Template: We use html and css to write ui view code, which contains instructions and expressions of AngularJs, and will eventually be compiled by the AngularJs compilation mechanism to attach to the dom tree. The directives of AngularJs can be extended freely by us.
Presentation layer logic: including application logic and behavior. Use javascript definition as view controller logic. As the MVC framework in AngularJs, we do not need to add event listening for dom level in the controller, which is already built in AngularJs. After the ui node dom event occurs, AngularJs will automatically go to a certain behavior (Action) logic on the scope.
Data: Viewobject needs to be referenced by AngularJs Scope (appeared as service in 1.0), which can make any type of javascript object, array, primitive type, object. In addition, AngularJs will automatically update the model asynchronously, that is, it will automatically refresh the model (mode) when the ui changes, and on the contrary, it will automatically refresh the ui when the model changes. Here we do not need to define some column methods such as getters and setters.
Here is a view from the official one:
At the same time, AngularJs provides us with some useful services for columns, and allows us to add services for our own specific business, providing the underlying ajax, cache, URL routing, browser abstract services, and we can use any combination of these services to the AngularJs injection mechanism. At the same time, AngularJs is also a highly testable javascript framework. You can see that in the official examples, they all have test programs on them and give BDD (behavior-driven) development framework.
The above is the AngularJs Javascript MVC framework introduced to you by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support to Wulin.com website!