IE Model problem

updating model doesn't work in IE.

by Artur Nowakowski

HTML

<script src="http://www.getuikit.com/dist/js/uikit.min.js"></script>
<link rel="stylesheet" href="http://www.getuikit.com/dist/css/uikit.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
    <h1>Angular 1.3</h1>
    {{hello}}
    <pre>{{testModel}}</pre>
    <input type="text" my-input ng-model="testModel">
</div>

JavaScript

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


app.controller('MyCtrl',function MyCtrl($scope) {
    $scope.hello = "Hello world!";
    console.log('hi');   
});

app.directive('myInput',function(){
    return{
        restrict: 'A',
        require: 'ngModel',
        scope: {},
        priority: 1,
        link: function(scope, elem, attrs, ngModel){
            elem.off('input');
            elem.off('change');
               
            ngModel.$render = function(){
                var model = {
                    'sampleData': 'sampleData',
                    value: ''
                }                                   
                ngModel.$setViewValue(model);
                elem.val(model.value);
            }
            
            elem.on('input', function(){
               var val = elem.val();
                ngModel.$setViewValue({
                    'sampleData': new Date().getTime(),
                    value: val
                });
                scope.$apply();
            });
        }
    }
});