AngularJS $watch prototypical inheritance.
Does not work.
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MainCtrl">
{{dog.foo}} {{dog.bar}}
<br/>
<input type="text" ng-model="dog.foo"></input>
<input type="text" ng-model="dog.bar"></input>
</div>
JavaScript
var app = angular.module('myApp', []);
app.controller('MainCtrl', function($scope) {
var Animal = {};
Animal.update= function () {
this.foo = 'foo';
}
// This fromObject function sets the properties of the current Animal to that of the provided generic object.
Animal.prototype.fromObject = function(object) {
this.foo = object.foo;
return this;
};
function Dog() {
Animal.update.call(this);
this.bar = 'bar';
}
Dog.prototype = new Animal();
Dog.prototype.constructor = Dog;
Dog.prototype.fromObject = function(object) {
this.bar = object.bar;
return Animal.prototype.fromObject.call(this, object);
};
$scope.dog = new Dog();
var tempDog = new Dog(),
tempDog2 = new Dog();
$scope.dog.foo = 'foo2'; // Check to see if changes propagate.
tempDog.foo = 'foo2';
$scope.$watchCollection('dog', function(newValue, oldValue) {
console.log(tempDog2.fromObject(oldValue) === tempDog);
});
});