handle function calls in directives
Closed this issue · 1 comments
ECorreia45 commented
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
ECorreia45 commented
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>