Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

The view is not updated when the model updates in AngularJS

I have read threads on this issue such as: The view is not updated in AngularJS but I still can't understand how to apply it on my simple example.

I have this function:

function MyPageView($scope) {
  var myModel = new MyModel();
  $scope.myModel = myModel;
}

when myModel is updated elsewhere in the code (when user clicks, interacts, send XHR requests) it doesn't update my view. I understand I need to do something with $apply but I didn't understand where and how.

Can someone explain to me how do I solve this issue for this simple use-case?

My model looks something like this (if that is necessary for the question) - it has no AngularJS code inside of it:

var MyModel = function() {
  var _this = this;
  ...
  _this.load = function(){...};
  _this.updateModel = function(){...};
  ...
  return _this;
}

adding a JSfiddle example: http://jsfiddle.net/DAk8r/2/

like image 697
Alon Avatar asked Jan 17 '13 07:01

Alon


People also ask

Which AngularJS feature causes changes in the model to automatically update the view and vice versa?

Data Binding: AngularJS comes with auto synchronization between the Model and the View. It means if there is a change in the model, the view updates automatically and vice versa.

What is view model in AngularJS?

In angular, the view is your HTML, the controllers are your angular controllers (no surprise on this one) and the ViewModel is the $scope object which you can access from either the controller or the view (it's kind of like the glue that links the controller to the view).

What are models in AngularJS?

The model in an MVC-based application is generally responsible for modeling the data used in the view and handling user interactions such as clicking on buttons, scrolling, or causing other changes in the view. In basic examples, AngularJS uses the $scope object as the model.


1 Answers

try $scope.$apply() inside your controller after you update your model

like image 122
Kaushik Shrestha Avatar answered Oct 01 '22 06:10

Kaushik Shrestha