Document that 'ng-model' does not work with a widget created from 'SE…

…LECT' element

docs/AngularJS/Troubleshooting/common-issues.md

@@ -51,6 +51,64 @@ The proper way to handle such unevaluated templates is to use a custom AngularJS
 
 Fore more details, refer to the [article on the priorities of AngularJS directives](https://docs.angularjs.org/api/ng/service/$compile).
 
+### Widget With 'ng-model' Directive Does Not Reflect Model Value
+
+Since `Angular 1.4.9` widgets initialized from `SELECT` element **does not reflect changes to the model field**. This is due to a change in the Angular implementation related to `ngModel.$render`. In the new Angular versions, that method is **overridden** in favor
+to a custom Angular implementation that supports adding custom `OPTION` elements. This enhancement, however, breaks our `ngModel` support, because we also depends on `ngModel.$render` method to reflect any changes done in the model.
+Basically our [ngModel.$render](https://github.com/telerik/kendo-ui-core/blob/master/src/kendo.angular.js#L388) is **directly overridden** by the Angular new function.
+
+#### Solution
+
+The available workarounds in this case are:
+
+- Use `k-ng-model` directive instead. Check the [corresponding documentation](http://docs.telerik.com/kendo-ui/AngularJS/introduction#scope-bindings) for more details.
+- Use `k-ng-delay` mapped to the `ng-model` model field. The purpose of this code is to postpone the `ngModel.$render` set on our side, hence it will win over the Angular `ngModel.$render` custom method
+
+##### Example using `ng-model` directive
+
+```
+<div id="example" ng-app="KendoDemos">
+    <div class="demo-section k-content" ng-controller="MyCtrl">
+
+    <h4 style="padding-top: 2em;">Remote data</h4>
+    <select kendo-drop-down-list
+            k-data-text-field="'ProductName'"
+            k-data-value-field="'ProductID'"
+            k-data-source="productsDataSource"
+            ng-model="selectedProductId"
+            k-ng-delay="selectedProductId"
+            style="width: 100%"></select>
+
+      <h4 style="padding-top: 2em;">Selected Product Id</h4>
+      <em>{{selectedProductId}}</em>
+
+</div>
+</div>
+
+<script>
+  angular.module("KendoDemos", [ "kendo.directives" ])
+      .controller("MyCtrl", function($scope, $timeout){
+          $scope.productsDataSource = {
+            type: "odata",
+            serverFiltering: true,
+            transport: {
+                read: {
+                    url: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
+                }
+            }
+        };
+
+    $scope.selectedProductId = null;
+
+    //simulate delay to fetch selectedID
+    $timeout(function(){
+      $scope.selectedProductId = 2;
+    },2000);
+
+  })
+</script>
+```
+
 ### Widget Loses Its Value
 
 When the `ng-model` and `k-ng-model` directives are applied together, there is a chance for the widget to lose its value. This is due the fact that both directives update the element value simultaneously, which results in a conflict issue.