Angularjs Study note 1-angular General introduction and its characteristics

The previous development (web or mobile) front-end primarily uses jquery+ native JS, and if some front-end UI frameworks are used, it might itself provide some APIs to use. And now a lot of UI frameworks are based on jquery, so say that from jquery across to Angularjs span, study for a period of time Angularjs, the following from the overall feel it:

About the comparison with jquery

First, angular is an MVC framework that differs from jquery in that it focuses on MVC code decoupling, using Model,controller and view to organize the code, which gives you a lot of API functions, You can not write a lot of native JS to achieve more complex effects, such as animation, $.animate, such as the effect if the need for native JS to write, the amount of code will be relatively large;

Second, jquery does not define how your code is organized, you can refer to it in a separate JS file, or you can write it directly on the page with a script tag and even write it directly inline in the HTML tag. But ANGULARJS will be an HTML page into several modules, each module can be their own scope,service and directive, each module can also communicate, but the overall structure is relatively clear, that is, its code organization is modular.

Finally, the idea of jquery is to design the page first and then display the page after DOM operation on the basis of the existing page, but the angular view may be just a frame, and the DOM operation or the time monitoring of the view is implemented in directive. And in general, rarely do you write the DOM code directly, as long as you listen to model. The view also changes after the model has changed.

About applicable occasions

jquery should apply to most web development, mobile also has (jquerymobile), Angularjs someone said is more suitable for spa (I personally think the spa on the phone may cause a performance problem, because its dirty check mechanism will affect performance), on the web side, Some crud applications or management software can be used (of course, the understanding may not be accurate, and will be learned and used in depth).

About the combination of UI

Developing any product requires a front-end UI, and many of the UI is now based on jquery, which means that if you want to use Angularjs and these UI components, you need to rewrite the components with ANGULARJS directive, which is a tricky process, fortunately, Angular provides us with some UI components that can be used (web-side is primarily combined with bootstrap front-end components), http://angular-ui.github.io/, while on the mobile side is primarily a combination of the Ionic framework/HTTP/ ionicframework.com/, but with the development of angular, many HTML5 front-end frameworks are slowly integrated with the ANGULARJS version available.

About the characteristics of Angularjs

1. Bidirectional binding of data: This may be its most exciting feature, the view layer of data and the model layer of data is two-way binding, one of the changes, the other side will change, this does not need you to write any code! (Think about how to do it in jquery mode.)

2. Code modularity, each module's code independently has its own scope, Model,controller and so on.

3. Powerful directive can encapsulate many functions into HTML tags, attributes or annotations, which greatly beautify the structure of HTML and enhance the readability;

4. Dependency injection, the design pattern of this back-end language to the front-end code, which means that the front-end code can improve reusability and flexibility, the future pattern may be a large number of operations on the client, the server only provide data sources and other clients can not complete the operation;

5. Test-driven development, ANGULARJS from the outset, the use of angular developed applications can be easily carried out unit testing and end-to-end testing, which solves the traditional JS code difficult to test and maintenance of defects

The above is the study of Angularjs a period of time to come to the conclusion that some of the areas may be overlooked, it is okay, then we will expand one of the steps to learn.

Angularjs Study note 1-angular General introduction and its characteristics