TylerJPresley · March 7, 2017 19:43
diff --git a/app.html b/app.html
 <template>
  <require from="type-ahead-filter-value-converter"></require>
  
  <input type="text" value.bind="_filter">
  <hr>
  <div repeat.for="item of items | typeAheadFilter:'text':_filter">${item.text}</div>

 </template>
diff --git a/app.js b/app.js
 export class App { 
  
  items = [
      { id: 1, text: 'apple' }, 
      { id: 2, text: 'peach' }, 
      { id: 3, text: 'orange' }, 
      { id: 4, text: 'berry' }, 
      { id: 5, text: 'melon' }
    ];
  
   
 }
diff --git a/index.html b/index.html
 <!doctype html>
 <html>
  <head>
    <title>Aurelia</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body aurelia-app>
    <h1>Loading...</h1>
    
    <script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/jspm_packages/system.js"></script>
    <script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/config.js"></script>
    <script>
      System.import('aurelia-bootstrapper');
    </script>
  </body>
 </html>
diff --git a/type-ahead-filter-value-converter.js b/type-ahead-filter-value-converter.js
 export class TypeAheadFilterValueConverter {

  toView(value, prop, filterText) {
    if (!Array.isArray(value) || !filterText) {
      return value;
    }
    return value.filter((i) => i[prop].indexOf(filterText) > -1);
  }

 }
	<template>
	<require from="type-ahead-filter-value-converter"></require>

	<input type="text" value.bind="_filter">
	<hr>
	<div repeat.for="item of items \| typeAheadFilter:'text':_filter">${item.text}</div>

	</template>
	<!doctype html>
	<html>
	<head>
	<title>Aurelia</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body aurelia-app>
	<h1>Loading...</h1>

	<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/jspm_packages/system.js"></script>
	<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/config.js"></script>
	<script>
	System.import('aurelia-bootstrapper');
	</script>
	</body>
	</html>
	export class TypeAheadFilterValueConverter {

	toView(value, prop, filterText) {
	if (!Array.isArray(value) \|\| !filterText) {
	return value;
	}
	return value.filter((i) => i[prop].indexOf(filterText) > -1);
	}

	}