1

From here

In general, a Controller shouldn't try to do too much. It should contain only the business logic needed for a single view.

I can't understand why it's controller. It must be model. Please,explain.

EDIT:
This is the example from official developer guider:

angular.module('invoice1', [])
.controller('InvoiceController', function() {
  this.qty = 1;
  this.cost = 2;
  this.inCurr = 'EUR';
  this.currencies = ['USD', 'EUR', 'CNY'];
});

<div ng-app="invoice1" ng-controller="InvoiceController as invoice">
  <b>Invoice:</b>
  <div>
    Quantity: <input type="number" min="0" ng-model="invoice.qty" required >
  </div>
  <div>
    Costs: <input type="number" min="0" ng-model="invoice.cost" required >
    <select ng-model="invoice.inCurr">
      <option ng-repeat="c in invoice.currencies">{{c}}</option>
    </select>
  </div>

What I don't understand is that controller = model here. Am I not right?

Improve this question
21
  • @Yoshi I totally agree with you. But such questions are too. Commented Dec 11, 2014 at 13:36
  • 1
    It was a fair question because the answer to yours seems self-intuitive, making it unclear why you asked. Commented Dec 11, 2014 at 13:37
  • @PashaTurok Plalx only helped you for your question. Commented Dec 11, 2014 at 13:38
  • 4
    @PashaTurok The example you posted, though from the official guide, is a bit unfortunate as it only shows the controller as a data-container. Which makes it look like the actual model. With the example given think of qty, cost, inCurr and currencies as individual models, instead of all as one. There is even an argument to use this.viewModel inside the controller, which would make this a lot clearer. Commented Dec 11, 2014 at 13:44
  • 1
    Now your question is more clear, but it might better be phrased as "Why does this controller contain model data?" It's probably a reasonable question considering that the example controller isn't strictly following MVC principles. Commented Dec 11, 2014 at 13:45

3 Answers 3

Reset to default
4

please understand controller does the business logic only.

MVC-model views and controllers.

model:only the data

view:View is display of model that is your data.  only the visible part(html)

controller: which handles and manipulates the data.

Model is data, not the business logic and controller handles it. also read this

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Model is just data when you use Anemic domain model.
3

Model usually contains data and methods directly connected with that data. Controller connects that data with view (and services etc. in Angular's case). What exactly Angular's controllers do. It is common practice when people put a lot of logic to models or controllers. In Angular way there is a lot of other stuff that contain the logic. Models contain just the data, controllers using just to connect all that parts together. Look closely at ng-model directive: it's actually bind to view just a variable!

[Added later, after example added to question] He-he! That's tricky example. In it controller actually looks like a model. Look better at this example

phonecatApp.controller('PhoneListCtrl', function ($scope) {
  $scope.phones = [
    {'name': 'Nexus S',
     'snippet': 'Fast just got faster with Nexus S.',
     'age': 1},
    {'name': 'Motorola XOOM™ with Wi-Fi',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 2},
    {'name': 'MOTOROLA XOOM™',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 3}
  ];

  $scope.orderProp = 'age';
});

Here controller is controller, phones and orderProp are models and $scope is scope. =) Look at this picture: enter image description here You can see there models are 'inside' the controller's scope.

MVC is actually just pattern. You are free to use it in different mysterious ways, there are no compiller errors about wrong pattern usage. But the only reason to use it - to make stuff more straightforward. So less tricky ways are better!

Improve this answer

Comments

3

Angular does not strictly follow the MVC. It is closer to MVVM: Model-View-ViewModel (or Model-View-Whatever, not that it is very helpful though).

In a nutshell:

  • Angular Controller and Scope go into the ViewModel layer:

The ViewModel can be considered a specialized Controller that acts as a data converter. (From here).

Its responsibility is to represent only the data needed for the View and glue them to the View. The data here are typically copied or referenced from the actual Model layer.

  • The Model layer (in MVVM) knows nothing about the View. This is where Angular Services go, and where you want to put the most of your business logic, to keep the Angular Controller (i.e. the ViewModel layer) thin.

A typical violation of this pattern, sadly frequently occuring in various tutorials, is to put server requests into Controller. Imagine you want to change your backend - now you are rewriting your Controller! Every single one that talks to your backend! Instead your Controllers should not know anything about the server. That information goes into your Model (Angular Services). Then with any change of the backend, you only need to rewrite the Services specifically dealing with it. Much cleaner and easier to maintain.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.