<div
    multi-select
    input-model="$scope.allList"
    output-model="$scope.selectedList"
    button-label="property1 property2 ..."
    selection-mode="multiple"
    owner-tool-tip="ToolTip"
    min-search-length="3"
    is-disabled="true | false"
    helper-elements="all none reset filter"
    on-open="$scope.functionOpen()"
    on-close="$scope.functionClose()"
    on-focus="$scope.functionFocus()"
    on-blur="$scope.functionBlur()"
    default-label="default text">
</div>

//switch icons(search,clear):
$scope.$watch('inputLabel.labelFilter', function (newVal) {
  var buttonToggle = angular.element(element).find('.inputFilter').parent();
  if (newVal && newVal.length > 0) {
    if (!buttonToggle.hasClass('is-focus')) {
      buttonToggle.addClass('is-focus');
    }
  }
  else {
    if (buttonToggle.hasClass('is-focus')) {
      buttonToggle.removeClass('is-focus');
    }
  }
});

// the following are from original code for my reference.
angular.element( document ).bind( 'touchmove', onTouchMove);
// unbind document events to prevent memory leaks
$scope.$on( '$destroy', function () {
  angular.element( document ).unbind( 'touchstart', onTouchStart);
});