Polymer：計算されたバインディングでインポートされた関数を使用する方法

Question

異なるカスタム要素の計算されたバインディングに共有関数を使用したいと思います。これは可能ですか？

は、どんなに私が共有機能をインポートする方法、私はコンソールエラーが出るん：私は要素の上のタグを使用してみました

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

：

method `formatAmount` not defined 

計算結合のようなものです。私は要素の中で試しました。そして私はindex.htmlで試しました。

計算されたバインディングメソッドはすべてカスタム要素で定義する必要があり、共有できませんか？ミックスインを使用する必要がありますか？

更新：共有メソッドを呼び出すカスタム要素でプライベートメソッドを定義するところで、醜い作業を作成しました。次に、計算されたバインディングでプライベートメソッドが使用されます。これは余分な定型文のために醜いです。

... 
<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> 

Answer 1

これは、私が数ヶ月前に尋ねたものと同様です。question

mixinを使用できます。 A mixinは、単にクラスを取り、サブクラスを返す関数です。あなたが詳細を知りたい場合click here。あなたの問題のために

別のHTMLファイルにmixinを定義するには言う - my-mixin.html：

const MyMixin = (superClass) => class extends superClass { 

    constructor() { 
     super();   
    } 

    formatAmount(amount) { 
     //function contents 
    } 

} 

そして、あなたの要素のインポートにとミックスインを追加します。

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

class MyFoo extends MyMixin(Polymer.Element)

それから要素から関数を呼び出すことができます：

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

スクリプトの機能にアクセスするには、super.formatAmount(amount)を使用します。