Improve our Accounts List

In this module you will improve upon the current accounts list by adding an inline search function.

Step 1 : Inline Search

Update the www/templates/accounts.html so it looks like this. Note the highlighted lines. We are adding a search box to the top of our page and binding it to the variable. This value is then used to filter the output of our collection-repeat.

Here we have also added a button for clearing the search… we will hook that up later on in this section.



Step 2 : Clear the search box

Add the following highlighted lines near the top of our AccountsCtrl. This sets up a object and also exposes a clearSearch function that our template above calls when a user clicks on the cross to clear their search input

Further down the AccountsCtrl add a new clearSearch function as follows. This is setting our variable to an empty string, and it is this variable that our input box in our template is bound too.