角：コンポーネントテンプレート内の外部静的クラスにアクセス

Question

対応するクラスの角成分があるとします。

@Component({ 
    selector: "test", 
    template: `  whatever ` 
}) 

export class TestComponent 
{} 

次に、静的メンバー（クラスにバインドされ、インスタンスにはバインドされていません）を持つクラスがあります。

export class Config 
{ 
    public static foo() : string 
    { return "blabla"; } 
} 

コンポーネントのテンプレートにConfig.fooを呼び出す方法はありますか？

template: ` {{ Config.foo() }} ` 

これをTestComponent内にラップして、それを私のコンポーネントで呼び出すと機能します。

template: `{{ myfoo() }}` 
... 
export class TestComponent 
{ 
    myfoo() 
    { return Config.foo(); } 
} 

しかし、それは私が欲しいものではありません。

Configはグローバル設定情報を保持する必要があり、多くのコンポーネントに情報をラップしたくありません。

もう少しエレガントな方法がありますか？私は注射（シングルトン）について考えましたが、ステートレスな定数情報の方が静的な方がより好きです。

ありがとうございます！

Answer 1

テンプレート内でConfig.fooメソッドを呼び出すことはできませんが、これは正常です。

テンプレート内では、二重角括弧（{{}}）内の式はコンポーネント自体に「スコープ」されています。thisは暗黙のうちに式に置かれます。

私はこのケースで頻繁に使用する事は、このように、「ゲッター」です：テンプレート内

get configFoo(): string { return Config.foo(); } 

、それは次のようになります。

{{configFoo}} 

Answer 2

スタティックママは、htmlテンプレートで直接アクセスできません。これらのメンバは、単一のオブジェクトを作成し、他のクラスに直接アクセスするために使用されます。だから私たちはhtmlテンプレートでその値を返す非静的メソッドを作成する必要があります。テンプレートは、このテンプレートに関連付けられたクラスである「this」で囲まれています。