AngularJS: DropdownList dissapears with k-rebind in directive

[Jakob]

Hi,

when I use DropdownList inside a directive with the option k-rebind, the Dropdownlist dissapears from DOM when i update the variable used for k-rebind.

This Dojo shows it:
http://dojo.telerik.com/OqAbE/2

What can i do to archieve the update?

Thanks !


When dojo ist not available:

<div ng-app="app" ng-controller="MyCtrl">
   <part-fields indexedreferenceoptions="indexedReferenceOptions"></part-fields>
</div>
<script>
  var app =angular.module("app", [ "kendo.directives" ]);
  app.controller("MyCtrl", function($scope, $http) {
    
    $scope.indexedReferenceOptions = {
      dataSource: [],
      dataTextField: "text",
      dataValueField: "value"
    }
    
    $scope.dataRecord = "";
    
     $http({ method: "GET", url: "customers.json" })
  .error(function(){      
       
        $scope.indexedReferenceOptions = {
          dataSource: [
            {"column1":0,"column2":"keine","column3":""},
            {"column1":5,"column2":"Frau Schmidt","column3":"z.Hd. Frau Schmidt"},            
            {"column1":6,"column2":"Herr Arber","column3":"z.Hd. Herr Arber"},
            {"column1":7,"column2":"Herr Meier","column3":"z.Hd. Herr Meier"}
          ],
          dataTextField: "column2",
      dataValueField: "column1"
        };
       
       $scope.dataRecord= 5;
      });
  });
  app.directive('partFields', function () {
    return {
        restrict: "E",
        replace: true,       
        scope: {            
            indexedReferenceOptions: '=indexedreferenceoptions'
        },
        controller: function ($scope) {
$scope.products = [{product: "milk", category: "food", price: 0.75}, 
                               {product: "eggs", category: "food", price: 1.76}];
        },
        template: ' <div class="form-inline"><div class="form-group" ng-show="true" ng-repeat="product in products"><label>{{ product.product }}</label><span ng-switch="product.category"><select class="form-control" ng-switch-when="food" kendo-drop-down-list k-options="indexedReferenceOptions" k-rebind="indexedReferenceOptions" k-value-primitive="true" k-ng-model="dataRecord"></select></span></div></div></div></div>'   
      
    };
});
</script>

[Georgi Krustev]

Hello Jakob,

In general, we do not suggest to use widgets in ng-repeat and then update their properties. You can find more details here.

What I would suggest is to use the k-ng-delay directive that will initialize the widget once the options are set, either in the error or in the success handlers. Check the updated Dojo demo (http://dojo.telerik.com/@ggkrustev/ogohO) for better understanding.

Regards,
Georgi Krustev
Telerik