Using Polymer Expressions for filters with arguments

321 views
Skip to first unread message

Randy Merrill

unread,
Aug 5, 2014, 9:32:53 AM8/5/14
to mi...@dartlang.org
Hi all,

I've been trying to add a filter to my dart polymer element and I am having trouble getting the arguments to work correctly.

With vanilla polymer expressions you can do a custom expression like this:

{{myNumber | toFixed(2)}}

by adding a custom filter to your element:

toFixed: function(value, precision) {
  return Number(value).toFixed(precision);
}

I am trying to do something similar in polymer.dart:

String toFixed(double value, int precision) => value.toStringAsFixed(precision);

But when it is called I get this error:

  1. Exception: Error evaluating expression '(minPayment | toFixed.null([2]))': Closure call with mismatched arguments: function 'call' NoSuchMethodError: incorrect number of arguments passed to method named 'call' Receiver: Closure: (double, int) => String from Function 'toFixed':. Tried calling: call(2) Found: call(value, precision)

Am I missing something about how the arguments to filters in the polymer.dart version of things?

Thanks,

Randy

Gee`Krumper

unread,
Aug 5, 2014, 9:52:01 AM8/5/14
to mi...@dartlang.org
Hi Randy,

I don't want to make false assumptions here, but right away the error is saying that you're calling a method with the wrong amount of arguments.
Required are two instead of one. Change your mustache definition with the a "precision" argmuent, assuming the other argument is the value.

e.g.: 

{{myNumber | toFixed(2, 2)}}

I hope this helps...

regards,
Eddie




--
For other discussions, see https://groups.google.com/a/dartlang.org/
 
For HOWTO questions, visit http://stackoverflow.com/tags/dart
 
To file a bug report or feature request, go to http://www.dartbug.com/new

To unsubscribe from this group and stop receiving emails from it, send an email to misc+uns...@dartlang.org.

Günter Zöchbauer

unread,
Aug 5, 2014, 9:59:01 AM8/5/14
to mi...@dartlang.org
I encountered this recently. AFAIR this was already supported at some time.

Günter Zöchbauer

unread,
Aug 5, 2014, 11:06:54 AM8/5/14
to mi...@dartlang.org
Edouard,

I tried 

{{myNumber | toFixed(myNumber, 2)}}

which leads to this exception

Filters must be a one-argument function.

but this works

{{toFixed(myNumber, 2)}}

Justin Fagnani

unread,
Aug 5, 2014, 1:35:32 PM8/5/14
to General Dart Discussion
Sorry, there's a slight difference between JS and Dart here because we've supported filters and function invocations before the JS implementation did. I think they're going to add function invocation on the JS side, and then it's possible that their filtering might work more like ours.

Filters are simply function-valued expressions, and the expression that produces the filter function can be anything, but often it's a function call itself, which of course already take parameters.

For the expression:

{{ myNumber | toFixed(2) }}

toFixed(2) needs to return a single-argument function.

If you have this in your element, it'll work:

class MyElement extends PolymerElement {
  String toFixed(int digits) => (num n) => n.toStringAsFixed(digits);
}

Cheers,
  Justin

Jiakui Wang

unread,
Aug 5, 2014, 1:53:46 PM8/5/14
to mi...@dartlang.org
Can you rewrite your code without "=>" ? Thanks!

Justin Fagnani

unread,
Aug 5, 2014, 2:13:28 PM8/5/14
to General Dart Discussion
On Tue, Aug 5, 2014 at 10:53 AM, Jiakui Wang <ira...@gmail.com> wrote:
Can you rewrite your code without "=>" ? Thanks!

In what way? Do you mean use return statements? That doesn't change anything except the line count :) but here you go:

class MyElement extends PolymerElement {
  String toFixed(int digits) {
    return (num n) {
      return n.toStringAsFixed(digits);
    }
  }
}

Günter Zöchbauer

unread,
Aug 5, 2014, 2:16:45 PM8/5/14
to mi...@dartlang.org
You mean like

class MyElement extends PolymerElement {

 
String toFixed(int digits) {
   
return (num n) {
     
return n.toStringAsFixed(digits);

   
};
 
}
}

Jiakui Wang

unread,
Aug 5, 2014, 2:30:03 PM8/5/14
to mi...@dartlang.org
Why do you have two return? This might be a silly question.

Thanks!

Justin Fagnani

unread,
Aug 5, 2014, 2:34:29 PM8/5/14
to General Dart Discussion
The expression toFixed(n) must return a function that is the filter itself. That function (which is anonymous) is called by PolymerExpressions to perform the actual filtering.

toFilter() is called a higher-order function, because it's a function that returns a function. This is a very powerful concept, but it can be a little mind-bending at first. Here's a wikipedia article on it: http://en.wikipedia.org/wiki/Higher-order_function

Jiakui Wang

unread,
Aug 5, 2014, 2:41:46 PM8/5/14
to mi...@dartlang.org
OK, this is to return a function.  By the way, dose Dart support parsing in a function as an argument, like C? This is a totally different question.

Thanks!


Matthew Butler

unread,
Aug 5, 2014, 2:45:54 PM8/5/14
to mi...@dartlang.org


On Tuesday, August 5, 2014 3:41:46 PM UTC-3, Jiakui Wang wrote:
OK, this is to return a function.  By the way, dose Dart support parsing in a function as an argument, like C? This is a totally different question.

Thanks!

Yes. Functions are first class citizens in Dart and can be passed or even assigned to variables. 

Randy Merrill

unread,
Aug 5, 2014, 5:06:40 PM8/5/14
to mi...@dartlang.org
Thanks for the help! That makes a lot more sense. It would be helpful if there was more documentation on adding custom filters like this as I couldn't find anything that talked about that requirement.

When you say "I think they're going to add function invocation on the JS side, and then it's possible that their filtering might work more like ours." You mean that instead of doing their current method (function with the value as the first argument) they will require custom filters to return a single argument function? Is there a polymer bug for that somewhere?
Reply all
Reply to author
Forward
0 new messages