typing_geo_javascript

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="myApp">
<div ng-controller="myCtrl" >
  <p>Write something in the input field:</p>
  <input type="text" ng-change="myFunc()" ng-model="myValue" >

</div>

<script>
  angular.module('myApp', [])
    .controller('myCtrl', ['$scope', function($scope) {
      $scope.x='';
      $scope.chars={'h': 'ჰ', 'S': 'შ', 'z': 'ზ',
         'f': 'ფ', 'C': 'ჩ', 'W': 'ჭ',
         'y': 'ყ', 'r': 'რ','c': 'ც',
         's': 'ს', 'a': 'ა', 't': 'ტ',
         'v': 'ვ', 'x': 'ხ','g': 'გ',
         'T': 'თ','l': 'ლ', 'u': 'უ',
         'm': 'მ','k': 'კ', 'i': 'ი',
         'd': 'დ', 'J': 'ჟ', 'b': 'ბ',
         'j': 'ჯ', 'o': 'ო', 'Z': 'ძ',
         'w': 'წ', 'R': 'ღ', 'p': 'პ',
         'n': 'ნ', 'q': 'ქ', 'e': 'ე',' ':' '};
      $scope.myFunc = function() {
      $scope.my='';
      for ( $scope.x in $scope.myValue){
            if ('ა'<= $scope.myValue[$scope.x]){
            $scope.my+=$scope.myValue[$scope.x];
            }
            else {
            $scope.my+=$scope.chars[$scope.myValue[$scope.x]];
            }
            }
      $scope.myValue=$scope.my
      };
    }]);
</script>
</body>
</html>