Polymer: How to use imported function in computed binding -


i'd use shared function computed bindings in different custom elements. possible?

no matter how import shared function, console errors:

method `formatamount` not defined 

the computed binding like:

<span>[[formatamount(amount)]]</span> 

i've tried using tag above element. i've tried inside element. , i've tried in index.html.

do computed binding methods need defined in custom element , can't shared? have use mixin?

update: i've created ugly work around define private method on custom element calls shared method. private method used in computed binding. ugly because of boilerplate.

... <script src="format-amount.js"></script>  <dom-module id="my-foo">   <template>     ...[[_formatamount(amount)]]...   </template>   <script>     class myfoo extends polymer.element {       ...       _formatamount(amount) {         return formatamount(amount); // defined in format-amount.js.       }     }   </script> </dom-module> 

this similar question have asked few months ago.

you can use mixin. mixin function takes class , returns subclass. if want learn more click here.

for problem define mixin in separate html file - my-mixin.html:

const mymixin = (superclass) => class extends superclass {      constructor() {       super();               }      formatamount(amount) {       //function contents       }  } 

and in element import , add mixin:

<link rel="import" href="my-mixin.html">

class myfoo extends mymixin(polymer.element)

then can call function element:

<template>   ...[[formatamount(amount)]]... </template> 

to access function in script use super.formatamount(amount).


Comments

Popular posts from this blog

resizing Telegram inline keyboard -

command line - How can a Python program background itself? -

php - "cURL error 28: Resolving timed out" on Wordpress on Azure App Service on Linux -