Anyone?
Vue.js: Custom search filter like multiple `LIKE` operators
I am trying to filter a set of users with Vue.js. The basic filterBy filter works fine so far, except it is searching for the exact string you enter.
HTML (with blade syntax):
<div id="wrapper">
<div>
<input type="text" v-model="search" class="form-control">
</div>
<div v-repeat="users | filterBy search in 'phone'">
@{ name } | @{ phone }
</div>
</div>
(The forum didn't display double mustaches so I removed one mustache in the HTML on name and phone.)
JavaScript:
new Vue({
el: '#wrapper',
data: {
search: '',
users: [
{ name: 'Billy', phone: '555-123-4567' },
{ name: 'Jack', phone: '999-123-4567' },
{ name: 'Beate', phone: '888-123-4567' },
{ name: 'Zorro', phone: '333-123-4567' },
{ name: 'Udo', phone: '444-123-4567' }
]
}
});
What I am looking for is a custom filter which functions more like the SQL LIKE operator with wildcards.
e.g. if I search for 333 4567, I want it to return the user Zorro. In SQL terms I would write something like LIKE %333% AND LIKE %4567%. How can I achieve this with JavaScript/Vue? Any help is very much appreciated.
Please or to participate in this conversation.