AngularJS Example

by sunil puvvada

HTML

<div ng-app="App">
  <form name="myForm" ng-controller="Ctrl"> 
      
      <select ng-model="test" ng-options="t.value as t.name for t in tests"></select>
		{{test}}
      {{testtype}}
      
      <input type="checkbox" ng-model="test" ng-true-value="1" ng-false-value="0" /> 
   </form>
</div>

CSS

</style> <!-- Ugly Hack to make remote files preload in jsFiddle --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.min.js"></script>
<style>

JavaScript

var app = angular.module('App', []);

function Ctrl($scope) {
    $scope.tests = [
        {name:'test1', value: 1},
        {name:'test2', value: 2},
        {name:'test3', value: 3}
  ];
    
    $scope.test = 1;
    $scope.$watch(function(newval, oldval) {
    $scope.testtype = typeof $scope.test;
    });
}

app.directive('parseInt', [function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, elem, attrs, controller) {
            controller.$formatters.push(function (modelValue) {
                console.log('model', modelValue, typeof modelValue);
                return '' + modelValue;
            });

            controller.$parsers.push(function (viewValue) {
                console.log('view', viewValue, typeof viewValue);
                return parseInt(viewValue,10);
            });
        }
    }
} ])