angularjs - md-chips deletion by clicking the chip -

i'm new angularjs. i'm using md-chips create chips based on drop down selection. mobile view, delete md-chips clicking chip instead of making user click small 'x' on chip. if make read-only can't delete chip. ideas appreciated. thanks.

html:

            <div ng-repeat="filter in sc.filters">                <md-chips ng-model="filter.value" ng-if="sc.isarray(filter.value)" md-on-remove="sc.filter()">                   </md-chips>             </div> 

you can use md-on-select="ctrl.remove($chip)" callback $chip contains element of ng-mode array has been clicked on. in remove function can remove element array. according example like follows:

$scope.remove = function($chip) {   var idx = self.fruitnames.indexof($chip)   $scope.filters.splice(idx, 1) } 

a working fiddle can found here: jsfiddle