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/
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.
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).
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.
try $scope.$apply() inside your controller after you update your model
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With