Introduction to angularjs


Introduction to angularjs


Angularjs was born in 2009, founded by Misko hevery and others, and later acquired by Google. Is an excellent front-end JS framework, which has been used in many Google products. Angularjs is designed to overcome the shortcomings of HTML in building applications. Angularjs has many features, the most core of which are MVVM, modularization, automatic two-way data binding, semantic tags, dependency injection and so on.

Reading materials


MVVM framework

The full name of MVVM framework is model view ViewModel, which is a design pattern proposed by Microsoft and widely used on WPF and winphone. The design concept of MVVM can be referred toMicrosft article

[initialization process]

  1. Set the corresponding relationship between ViewModel and model, and establish ViewModel

  2. Bind the ViewModel to the corresponding view and render it

Introduction to angularjs

The biggest difference between MVVM and traditional MVC framework lies in the process of receiving user action for update

Traditional MVC update process

Introduction to angularjs

  1. The view receives the user action of the user and calls the controller to do the corresponding business processing

  2. The controller updates the model according to the business logic

  3. After the model update is completed, the controller updates the view with the new model data

Introduction to angularjs

  1. The view | viewcontroller receives the user action of the user and calls the ViewModel to update the corresponding business processing data

  2. The view is updated after the ViewModel data is updated

  3. After the ViewModel data update is completed, notify the model to update

Now it has been updated, called mvw (model view whatever)… Whatever

Reading materials

Two way data binding

One way data binding: model and template must be rendered and redrawn when updating the view

Introduction to angularjs

Two way data binding: one-time template compilation and continuous update of view

Introduction to angularjs

Reading materials

Dirty checking

Introduction to angularjs

I thought this was the best place in angularjs

  1. During rendering, all data bindings will be added to the $watch list

  2. When an event occurs, call the $apply method to check the data consistency, that is, whether the ViewModel is consistent with the model (similar to the event trigger mechanism)

  3. Think of dirty checking as a digestive system. The digestive system will run the number of digestive organs (PAI) (Xie) (Wu)

Dependency injection

An angular. Injector (modules) di injection syringe is provided for us in the framework

myController.$inject = ['$scope', '$alert'];

Reading materials


Why angularjs

  1. The template has powerful and rich functions, with rich declarative angular instructions;

  2. Perfect front-end MVC framework, including all functions such as template, two-way data binding, routing, modularization, service, filter, dependency injection and so on;

  3. Customize directive, customize HTML tags;

  4. The amount of code is very small;

  5. Unit test;

  6. Rich documentation and open source resources



Rich resources are the important reason why angularjs was chosen

Recommended Today

[Mr. Zhao Qiang] use mongodb’s Web console

Mongodb can monitor the database through the web interface. By default, this option is turned off and needs to be turned on at startup.Enableweb Console, need to be startedmongodbAdd:–httpinterface Start mongodb and observe the output log information:   Use the browser to access port 28017 to see mongodb’s Web console interface.