Angular function model binding
HTML
<script src="http://code.angularjs.org/1.2.14/angular.js"></script>
<div ng-controller="MainCtrl">
<label>bound to prop: <input type="text" ng-model="{}leverans" /></label>
<p>
<label>bound to value: <input type="text" ng-model="test" /></label>
<ul>
<li ng-repeat="msg in messages">{{msg}}</li>
</ul>
{{test}}
<p>
Leverans:
{{leverans}}
</div>
JavaScript
var module = angular.module("myApp", []);
module.config(function ($provide) {
$provide.decorator('$parse', function($delegate) {
return function(expression) {
if (typeof(expression) !== "string" || expression.indexOf("{}") !== 0)
return $delegate(expression);
var propName = expression.substr(2);
// getter
wrapper = function(scope) {
var func = scope.hasOwnProperty(propName);
if (!func)
throw Error("Prop " + propName + " does not exist.");
return scope[propName];
};
// setter
wrapper.assign = function(scope, value) {
if (!scope.hasOwnProperty(propName))
throw Error("Prop " + propName + " does not exist.");
scope[propName]=value;
};
return wrapper;
};
});
});
module.controller("MainCtrl", ['$timeout', '$scope', function($timeout, $scope) {
$scope.messages = ["Init"];
$scope.test = "foo";
$timeout(function(){$scope.leverans = "INCOMING after 2s!!!";}, 2000);
$scope.get_fnc = function () {
console.log("in get_func");
return $scope.test;
};
$scope.set_func = function (val) {
console.log("in set_func");
$scope.test = val;
};
}]);