Angular 1.4 BETA Text Binding bug
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
<body ng-app="myApp" ng-init="testObject={switch:false}">click that:
<div switch model="testObject.switch">
<hr>transcluded input:
<input type="checkbox" ng-model="$parent.testObject.switch">
<hr>
</div>
</body>
CSS
.switch {
display:block;
cursor:pointer;
background:yellow;
}
JavaScript
var booleanSwitchModule = angular.module('myApp', []);
booleanSwitchModule.directive('switch', [
function () {
return {
scope: {
model: '=',
},
link: function (scope, elem, attr, ctrl) {
var timesChanged = 0;
scope.$watch('model', function (val) {
if (val != undefined) {
alert("model changed " + ++timesChanged + " times");
scope.switchPosition = scope.model;
}
});
},
restrict: 'EA',
replace: true,
transclude: true,
template: '<label class="switch">' +
'directive scope model: {{model}}' +
'<span ng-transclude></span>' +
'</label>',
}
}]);