angularjsui-selectangular-ui-select

ui-select multiple: ng-model how will it be saved as string and not as array


I have this ui select:

<ui-select multiple
    ng-model="meas.daysSelected"
    theme="bootstrap"
    close-on-select="false">
    <ui-select-match placeholder="days">{{$item}}</ui-select-match>
    <ui-select-choices repeat="day in days | filter:$select.search">
        <div ng-bind-html="day | highlight: $select.search"></div>
    </ui-select-choices>
</ui-select>

$scop.days = ['Sun', 'Mon', 'Tue' ... ] 

it is in a simple table with angular ng-repeat

<tr ng-repeat="meas in foo= (res.foos | filter: subSearch : strict)">

and I filter it with:

<input type="text" class="form-control" ng-model="subSearch.daysSelected">

The problem is like this: the "daySelected" model is becoming an array when I select an object and then de-select it. the filter of angular just dismisses it and filters it. So I need help in one of the 2:

  1. make daySelected as a string (when selected it will be: "sun, mon" or
  2. adjust the filter to work in array

Solution

  • Assuming the search text is going to be like "Mon,Tue" which will filter all the ui-selects which have ["Mon","Tue"] you can write your own filter function and pass that. For example:

    <tr ng-repeat="meas in foo= (res.foos | filter: $ctrl.filterDaysSelected">
    

    And in your controller you'd need to create that function:

    $ctrl.filterDaysSelected = function(value, index, array) {}
    

    Where you would need to: