How to refresh data in angularjs kendo-multi-select

Question

I am new to angularjs. i am using kendo multiselect i am adding data by default when loading the view. and i have one save button when click that button i am calling Success method inside that method.

Inside that method i am trying to replace another data into that multiselect. Scope is updating fine, But multiselect textbox showing empty. not showing the data.

$scope.Details.EmailIDs = [
  { "Selected": false, "Text": "sample1", "Value": "[email protected]" },
  { "Selected": false, "Text": "sample2", "Value": "[email protected]" }
];

$scope.ButtonClick = function () {
 $scope.Success();
}

$scope.Success = function () 
 {
   $scope.Details.EmailIDs = [
   { "Selected": false, "Text": "data1", "Value": "[email protected]" },
   { "Selected": false, "Text": "data2", "Value": "[email protected]"}
        ];
 }

here is my html code

     <select kendo-multi-select k-options="UserOptions" k-value-primitive="false" k-ng-model="Details.EmailIDs"></select>
     <button class="k-button" ng-click="ButtonClick()">Save</button>

Answer 1

You are not adding rather replacing value, to add use like this

$scope.Success = function () 
 {
 $scope.Details.EmailIDs.push({ "Selected": false, "Text": "data1", "Value": "[email protected]" });
 $scope.Details.EmailIDs.push({ "Selected": false, "Text": "data2", "Value": "[email protected]"});
}