Allow ng-model bindings to arbitrary functions

[camshaft]

This allows for very flexible 2-way binding to inputs through getters/setters.
For example:

<div ng-controller="MyCtrl">
  <input ng-model="fun"/>
</div>

<script>
  var myApp = angular.module('myApp',[]);

  myApp.controller('MyCtrl', function($scope) {
    var _test = 'Hello World!';
    $scope.fun = function(value) {
      if (value !== undefined){
        _test = value;
      }
      return _test;
    }
  });
</script>

The value of INPUT[ng-model="fun"] will be Hello World!. As the value changes from user input the function will be called with the new value as the argument, enabling the function to handle how the value gets set.

You can see a working example with this jsfiddle.

[jamie-pate]

What would be the advantage of this over using $scope.$watch ?

[camshaft]

@jamie-pate I guess there's not a huge difference except for it'd be built in for you. As you can see here it's essentially doing the work for you by calling $scope.$watch.

[ghost]

Why not simply use true getters/setters?

Herby

Cameron Bytheway wrote:

This allows for very flexible 2-way binding to inputs through
getters/setters.
For example:

|

<script> var myApp = angular.module('myApp',[]); myApp.controller('MyCtrl', function($scope) { var _test = 'Hello World!'; $scope.fun = function(value) { if (value != undefined){ _test = value; } return _test; } }); </script>

|
|

The value of INPUT[ng-model="fun"] will be 'Hello World!'.
As the value changes from user input the function will be called
with the new value as the argument, enabling the function to handle
how the value gets set.

You can see a working example with this jsfiddle
http://jsfiddle.net/CamShaft/kLgTL/10/.

---

    You can merge this Pull Request by running:

git pull https://github.com/CamShaft/angular.js master

Or view, comment on, or merge it at:

#1328

    Commit Summary

* Allow ng-model bindings to arbitrary functions


    File Changes

* *M* src/ng/directive/input.js (11)
* *M* src/ng/parse.js (11)
* *M* test/ng/directive/inputSpec.js (9)


    Patch Links

* https://github.com/angular/angular.js/pull/1328.patch
* https://github.com/angular/angular.js/pull/1328.diff

—
Reply to this email directly or view it on GitHub
#1328.

[camshaft]

After running some tests I think it would be better to use true getters/setters or Object.defineProperty. I'll go ahead and close this.