AngularJS MVC Architecture

Model View Controller or MVC (commonly known as MVC) is a software design pattern used for developing web applications. The Model View Controller pattern consists of the following three parts-

• Model − It is the lowest level responsible for maintaining the data pattern.

• View − It is responsible for displaying all or part of the data to the user.

• Controller − It is the software code that controls the interaction between the model and the view.

MVC is popular because it separates the application logic from the user interface layer and supports separation of concerns. Controllers receive all requests to the application and then use the model to prepare any data required for the view. Then, the view uses the data prepared by the controller to generate the final displayable response. The MVC abstraction can be graphically represented as follows.

Model (Model)

The model is responsible for managing application data. It responds to requests from the view and instructions from the controller to update itself.

View (View)

Data representations in a specific format, triggered by controllers to present data. They are script-based template systems, such as JSP, ASP, PHP, and are very easy to integrate with AJAX technology.

Controller (Controller)

Controllers respond to user input and perform interactions on data model objects. Controllers receive input, validate it, and then execute business operations that modify the state of the data model.

AngularJS is a MVC-based framework. In the following chapters, we will see how AngularJS uses the MVC method.