0

I'm using AngularJS with the angular-selectize module.

To populate the page with the elements I need I use something like this:

index.html

<selectize
    ng-repeat="select in selects_data track by $index"
    config="selectizeConfig"
    options="select.options"
    ng-model="selects_models[select.name]">
</selectize>

controller.js

$scope.update_data = function(){
    //I'm using AngularJS resource to get the JSON data from the server
    $scope.selects_data = StatesTableControl.get({'path': $scope.element.path},
        function(data){
            //Success
            angular.forEach(data, function(item){
                $scope.selects_models[item.name] = item.current_id
            });
        }, function(error){
            //Error
        }
    );
};

$scope.update_data();
$interval($scope.update_data, 3000);

No matter whether I use track by $index, track by select.name or don't use it at all, all of the <selectize></selectize> elements are redrawing completely every time I update the selects_data array with the data obtained from the server, even if the array content is the same after updating.

I haven't found any recipe to solve it by myself. And I can't understand why track by helps with the same thing when I use it inside div or other elements.

I'll be really glad if someone can help with the issue!

Oleg Kirichenko
  • 21
  • 1
  • 1
  • 5

1 Answers1

0

I don't think it has anything to do with the way you track items. If StatesTableControl.get returns new objects everytime you call it, I think angular considers they're different objects, even if they contain the same data.

You could send only the objects that have changed, or maintain a version number for the objects so you know the ones that haven't changed and you don't replace them.

yannick1976
  • 10,171
  • 2
  • 19
  • 27
  • Thank for the reply. When I use 'ng-repeat' without the 'track by' option, DOM elements rebuilds every time the source object or array changes. But if I use 'track by $index' option, DOM changes only when new elements appears or old elements are gone. It works with oher html elements like '
    ' but it doesn't work with the '' elements. I just don't get why.
     – Oleg Kirichenko Oct 31 '15 at 21:03