beforesemicolon/cwco

handle function calls in directives

Closed this issue · 1 comments

The following can be too much for template:

<li repeat="app.todos.filter(todo => app.searchTerm.length >= 3 ? todo.title.toLowerCase().search(app.searchTerm) >= 0 : true)"
></li>

This should be able to be formatted to

<li repeat="getSearchMatchedList(app.todos)"></li>

Right now the directive don't handle function calls as value, like the on* attributes do

This can be done by using a getter like so:

class ExampleComponent extends WebComponent {
    get searchMatchedList() {
       return this.app.todos
            .filter(todo => this.app.searchTerm.length >= 3 
                    ? todo.title.toLowerCase().search(this.app.searchTerm) >= 0 
                    : true)
    }
}
<li repeat="this.searchMatchedList"></li>