JSFiddle - React, Tailwind, and code Playground

by cgough

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
<input data-bind="value: searchQuery, valueUpdate: 'afterkeydown'" />

<select data-bind="options: filter, value: name" >
</select>

JavaScript

(function() {
  var ViewModel = function() {
    var self = this;

    var transferOptions =
      [{
        "number": 1,
        "name": "Home"
      }]


    self.searchQuery = ko.observable("");
    self.array = ko.observableArray([obj, obj2]);

    self.filter = ko.computed(function() {
      if (!self.searchQuery()) {
        return self.array();
      } else {
        return ko.utils.arrayFilter(self.array(), function(obj) {
          var tagsCheck = ko.utils.arrayFilter(obj.tags, function(tag) {
            return tag['name'].toLowerCase().indexOf(self.searchQuery().toLowerCase()) > -1
          });

          return (obj.name.toLowerCase().indexOf(self.searchQuery().toLowerCase()) > -1) || tagsCheck.length;
        });
      }
    });

    //End
  };
  ko.applyBindings(new ViewModel());
})();