ng-model doesn't update value when works together with ng-bind-html

I have a div where I render my html string, also I have a list of options which updates this string from controller, to render html I use ng-bind-html and function:

 ng-bind-html="trustTemplate(data.emailNotification.textTemplate)" $scope.trustTemplate = function (value) { var trust = value.replace(/\{{/g, "<span class='label label-danger' contenteditable='false' style='padding: 6px; color: #FFFFFF; font-size: 16px;'>").replace(/\}}/g, "<span ng-click='click($event)' contenteditable='false' class='remove-tag fa fa-times'></span></span>&nbsp;"); return $sce.trustAsHtml(trust); }; 

the problem here if user wants to type something ng-model doesn't update its value, I have tried $scope.$watch or setup watcher from directive and found that ng-model doesn't update its value, so I believe two way binding doesn't work.

Where is my mistake or what am I missing ?

Full code:

Html

 <div id="template" contenteditable="true" style="height: 200px; width: 100%; border: 1px solid #d7d7d7; padding: 10px" ng-model="data.emailNotification.textTemplate" ng-bind-html="trustTemplate(data.emailNotification.textTemplate)" markers ></div> 

Controller

 $scope.data.emailNotification.textTemplate = "User template user info: {{userFirstname}} - {{userLastname}}"; $scope.selectedVariables = function (item) { if(item !== null){ $scope.data.emailNotification.textTemplate = $scope.data.emailNotification.textTemplate.concat(' {{' + item + '}} '); } }; $scope.trustTemplate = function (value) { var trust = value.replace(/\{{/g, "<span class='label label-danger' contenteditable='false' style='padding: 6px; color: #FFFFFF; font-size: 16px;'>").replace(/\}}/g, "<span ng-click='click($event)' contenteditable='false' class='remove-tag fa fa-times'></span></span>&nbsp;"); return $sce.trustAsHtml(trust); }; $scope.$watch('data.emailNotification.textTemplate', function (newVal, oldVal) { console.log(newVal); console.log(oldVal); //updates only with init and function selectedVariables (). Show actual value of $scope.data.emailNotification.textTemplate }); $scope.selectedVariables(null); 

Directive

app.directive('markers', function () { return { require: 'ngModel', link: function (scope, element, attrs, ngModel) { ngModel.$render = function () { var newValue = ngModel.$viewValue; console.log(newValue) //updates only with init and function selectedVariables (). Show actual value of $scope.data.emailNotification.textTemplate }; attrs.$observe('ngModel', function(value){ // Got ng-model bind path here scope.$watch(value,function(newValue){ // Watch given path for changes console.log(newValue); //updates only with init and function selectedVariables (). Show actual value of $scope.data.emailNotification.textTemplate }); }); } } });