Introduction to anjularjs (1)

1. When to use anjularjs
AngularJs (hereinafter referred to as ng) is a structural framework for designing dynamic web applications. First of all, it is a framework, not a class library, which provides a complete set of solutions for designing web applications like EXT. It is not just a JavaScript framework, because its core is actually the enhancement of HTML tags. What is HTML tag enhancement? In fact, it is to enable you to complete part of the page logic with tags. The specific way is through custom tags, custom attributes, etc. These tags / attributes that are not native to HTML have a name in ng: directive. It will be described in detail later. So, what is a dynamic web application? Different from traditional web systems, web applications can provide users with rich operations, and can continuously update the view with user operations without performing url jumps. ng official also stated that it is more suitable for the development of CRUD applications, that is, applications with more data operations, rather than games or image processing applications. To achieve this, ng introduces some great features, including template mechanism, data binding, modules, instructions, dependency injection, and routing. Through the binding of data and templates, we can get rid of cumbersome DOM operations and focus our attention on business logic. Another question, is ng the MVC framework? Is it the MVVM framework? The official website mentioned that the design of ng adopts the basic idea of ​​MVC, but it is not entirely MVC, because when writing code, we are indeed using the ng-controller command (at least from the name, it is MVC), but this The business handled by the controller is basically interacting with the view, so it seems very close to MVVM. Let's turn our attention to the non-
obtrusive title of the official website: "AngularJS — Superheroic JavaScript MVW Framework".

2. Customer service template

The multi-page web application fills data in HTML through the background server program, and then returns the result to the browser. Single-page applications have also become AJAX applications, but so have some extensions. What is different with anjularJS is that it completes the combination of HTML templates and data on the client side. In this way, the server becomes the role of providing static resources for the front end and maintains these resources.

Let's take an example to see how anjularJS combines HTML templates and data on the front end. Let's take a hello, word example, but we don't write Hello, world in html, we write hello greeting as a data form that we can change later.

Look at the code

 1 <html ng-app>
 2 <head>
 3   <script src="angular.js"></script>
 4 </head>
 5 <body>
 6   <div ng-controller='HelloController'>
 7     <p>{{greeting.text}}, World</p>
 8   </div>
 9 </body>
10 </html>

3. Model-View-Controller (MVC)

The MVC application architecture was proposed as a part of Smalltalk in the 1870s. Since being proposed. It has become a popular architecture for building applications. No matter Java, C ++ or OC can see the shadow of MVC. But MVC is still very immature for web application building.

The core of MVC is to deal with the separation of data, logic and interface.

The view takes data from the model and presents it to the user. When the user interacts with the application. The controller is responsible for the corresponding. Then update the data in the model, the model informs the view of the data changes and then presents it to the user.

In Anjular applications, the rabbit is the DOM, the controller is the JavaScript class, and the model data is stored in the object properties.

We recognize MVC for several reasons: first, it gives you a metadata model to let you save data, so you do n’t have to regenerate data every time you use it. Your project will have an advantage in understanding what you write, when they know that you are using MVC structure to organize your code. Perhaps most importantly, we want to make your app easy to expand, maintain and test.

Published 5 original articles · Likes0 · Visits 144

Guess you like

Origin blog.csdn.net/m0_43519765/article/details/104332458