feat(ngModel): bind to getters/setters

BREAKING CHANGE

Closes angular#768

Author: btford

src/ng/directive/input.js

@@ -1820,7 +1820,24 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
       ctrl.$modelValue         = ctrl.$valid ? modelValue : undefined;
       ctrl.$$invalidModelValue = ctrl.$valid ? undefined : modelValue;
 
-      ngModelSet($scope, ctrl.$modelValue);
+      var useGetterSetter, getterSetter;
+
+      if (ctrl.$options && isDefined(ctrl.$options.getterSetter)) {
+        if (useGetterSetter = ctrl.$options.getterSetter) {
+          getterSetter = ngModelGet($scope);
+        }
+      } else {
+        getterSetter = ngModelGet($scope)
+        useGetterSetter = isFunction(getterSetter);
+      }
+
+      if (useGetterSetter) {
+        if (isFunction(getterSetter)) {
+          getterSetter(ctrl.$modelValue);
+        }
+      } else {
+        ngModelSet($scope, ctrl.$modelValue);
+      }
       forEach(ctrl.$viewChangeListeners, function(listener) {
         try {
           listener();
@@ -1896,6 +1913,12 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
   $scope.$watch(function ngModelWatch() {
     var modelValue = ngModelGet($scope);
 
+    if (isFunction(modelValue) && ((ctrl.$options && isDefined(ctrl.$options.getterSetter)) ?
+        ctrl.$options.getterSetter : true)) {
+
+      modelValue = modelValue();
+    }
+
     // if scope model value and ngModel value are out of sync
     if (ctrl.$modelValue !== modelValue &&
         (isUndefined(ctrl.$$invalidModelValue) || ctrl.$$invalidModelValue != modelValue)) {
@@ -2520,6 +2543,9 @@ var ngModelOptionsDirective = function() {
       } else {
         this.$options.updateOnDefault = true;
       }
+      if (this.$options.getterSetter === 'auto') {
+        this.$options.getterSetter = undefined;
+      }
     }]
   };
 };

test/ng/directive/inputSpec.js

@@ -664,6 +664,30 @@ describe('input', function() {
   });
 
 
+  it('should bind to a getter', function() {
+    compileInput('<input type="text" ng-model="name" name="alias" ng-change="change()" />');
+
+    scope.$apply(function() {
+      scope.name = function () { return 'misko'; };
+    });
+
+    expect(inputElm.val()).toBe('misko');
+  });
+
+
+  it('should bind to a setter', function() {
+    compileInput('<input type="text" ng-model="name" name="alias" ng-change="change()" />');
+
+    var name = '';
+    scope.name = function (newName) {
+      return typeof newName !== 'undefined' ? (name = newName) : name;
+    };
+    changeInputValueTo('adam');
+    expect(inputElm.val()).toBe('adam');
+    expect(name).toBe('adam');
+  });
+
+
   it('should not set readonly or disabled property on ie7', function() {
     this.addMatchers({
       toBeOff: function(attributeName) {
@@ -1213,6 +1237,54 @@ describe('input', function() {
       expect(inputElm.val()).toBe('');
     }));
 
+    it('should not try to invoke a model if getterSetter is false', function() {
+      compileInput(
+        '<input type="text" ng-model="name" '+
+          'ng-model-options="{ getterSetter: false }" />');
+
+      var spy = scope.name = jasmine.createSpy('setterSpy');
+      changeInputValueTo('a');
+      expect(spy).not.toHaveBeenCalled();
+      expect(inputElm.val()).toBe('a');
+    });
+
+    it('should always try to invoke a model if getterSetter is true', function() {
+      compileInput(
+        '<input type="text" ng-model="name" '+
+          'ng-model-options="{ getterSetter: true }" />');
+
+      var spy = scope.name = jasmine.createSpy('setterSpy').andCallFake(function () {
+        return 'b';
+      });
+      changeInputValueTo('a');
+      expect(inputElm.val()).toBe('b');
+      expect(spy).toHaveBeenCalledWith('a');
+      expect(scope.name).toBe(spy);
+
+      scope.name = 'c';
+      changeInputValueTo('d');
+      expect(inputElm.val()).toBe('c');
+    });
+
+    it('should try to invoke a model if getterSetter is "auto" and model is a function', function($timeout) {
+      compileInput(
+        '<input type="text" ng-model="name" '+
+          'ng-model-options="{ getterSetter: \'auto\' }" />');
+
+      var spy = scope.name = jasmine.createSpy('setterSpy').andCallFake(function () {
+        return 'b';
+      });
+      changeInputValueTo('a');
+      expect(inputElm.val()).toBe('b');
+      expect(spy).toHaveBeenCalledWith('a');
+      expect(scope.name).toBe(spy);
+
+      scope.name = 'c';
+      changeInputValueTo('d');
+      expect(inputElm.val()).toBe('d');
+      expect(scope.name).toBe('d');
+    });
+
   });
 
   it('should allow complex reference binding', function() {