javascript - Angular Material md-chips not refreshing correctly -

i developing app works "widget layout".

the user gets page dashboard different widgets can interact with, such table, graphs etc.

i adding global "filter" using <md-chips>, objective of having filters shared widgets , can updated widgets.

my filter list uses <md-chips>, read-only , md-removable set true. filters can deleted, or added interacting widgets (so added programmatically).

one of feature of "module" add new filter on field when graph element is clicked.

example :

here filters list before clicking graph element

now click on graph element in child controller of filter controller, $emit event global controller : "i want update filters ! here filter add"

and filter controller event , update filters accordingly ($scope.tags list of filters , model used in <md-chips>)

  // chips   $scope.tags = [];   $scope.readonly = true;   $scope.removable = true;    // filter listener   $scope.$on('filterchildchanged', function (event, filter) {     $scope.tags.push(filter);     console.log($scope.tags);     console.log("parent event fired !");   }); 

at point expect <md-chips>element refresh, because $scope.tags got new filter :

<md-chips     ng-model="tags"     readonly="readonly"     md-removable="removable"     id="filters">     <md-chip-template>{{$chip.value}}</md-chip-template>     </md-chips> 

but instead, nothing happens! , weird part is, refreshes when click on 1 of existing chip (i had "test" chip) !

tests : when push test chip on array before rendering :

$scope.tags.push({field: "testfield", value: "test"}); 

and click on bunch of graph elements, $scope.tags updated, visual stays same until select chip "test", <md-chips> appear triggered refresh function.

any hint on why <md-chips> element not refreshed $scope.tags (its model) updated but updated when chip selected ?

i tried trigger md-on-select force behavior happen every time add new filter $scope.tags got no luck far !

thanks reading !

note : using latest version of angular material (head master) see doc here : https://material.angularjs.org/head/ | built github repository.

edit : problem comes $$hashkey not being added objects, added when click on 1 of existing tags, need find way add $$hashkey attribute when add new filter

the problem came absence of $$hashkey when added new filter filters model chips ($scope.tags).

so needed change

$scope.tags.push(filter); 

to

$scope.$apply(function () {     $scope.tags.push(filter); }); 

and here console.log test

good thing learned : <md-chips> directive knows needs updated if <chip> objects have $$hashkey

see this on scope.$apply