Click here to Skip to main content
15,885,767 members
Articles / Programming Languages / Javascript

AngularJS Does Not Have a Model: It's not MV*, But Rather VM*

Rate me:
Please Sign up or sign in to vote.
5.00/5 (1 vote)
11 Feb 2015CPOL2 min read 9K   2   4
AngularJS does not have a Model: It's not MV*, But rather VM*

Where is the "model" in AngularJS? The answer to this question is:

AngularJS does not work with a real model but just with a view model. Therefore, it shouldn't be called an MVC framework, and neither an MV* framework, but rather a View-Model-Whatever (or VM*) framework.

A real MV* framework is based on model classes, like BackboneJS or ASP.NET MVC. A model class does not only define properties and methods for the objects that instantiate it. It also defines property constraints that are checked when validating user input. These constraints are defined in the model, but they are not only checked in the model (before save), but also in the view (on field input, on field change and on form submit).

AngularJS does not have any real concept of model class. It requires to define the validation logic in the view instead of the model. AngularJS binds HTML form fields and other HTML elements to special variables defined as properties of a view controller's $scope object (or of a resource object when using ng-resource). These variables represent view model fields, rather than properties of a model class. The resource classes that can be defined with ng-resource do not allow to express any substantial model class logic (like property constraints, as well as associations and inheritance relationships with other model classes).

The fact that AngularJS supports reading and saving the values of its $scope (or resource) object proerties from/to a remote data store doesn't turn these view fields into model properties. It just means that the AngularJS approach implies forwarding the field values directly to a cloud storage service or to the model of a back-end application without using the logic of a real model (class). The problem with this approach is not only a lack of model logic for constraint validation, but also a lack of model logic for associations and for inheritance relationships between model classes.

Apparently, the assumption of the AngularJS developers is that it's sufficient to have a model class in the back-end application without using its logic in the front-end. But this assumption is questionable. First, there may be no back-end application in the case of a front-end app with local storage. Second, if there is a back-end application with model classes, the (validation, association and inheritance) logic defined in these model classes should also be used in the front-end part of the app.

In summary, in an AngularJS app, there is only a view model and a view, but no model!

This article was originally posted at http://web-engineering.info/blog-feed.xml

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Instructor / Trainer
Germany Germany
Researcher, developer, instructor and cat lover.

Co-Founder of web-engineering.info and the educational simulation website sim4edu.com.

Comments and Discussions

 
GeneralLet's say Flexible Model instead of no Model Pin
RobTeixeira12-Feb-15 10:59
RobTeixeira12-Feb-15 10:59 
GeneralRe: Let's say Flexible Model instead of no Model Pin
Gerd Wagner12-Feb-15 13:22
professionalGerd Wagner12-Feb-15 13:22 
QuestionWhat about ngresource ? Pin
Nicolas Penin11-Feb-15 18:41
Nicolas Penin11-Feb-15 18:41 
AnswerRe: What about ngresource ? Pin
Gerd Wagner11-Feb-15 22:08
professionalGerd Wagner11-Feb-15 22:08 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.