かずきのBlog@hatena

日本マイクロソフトに勤めています。このブログは個人ブログなので、ここに書いている内容は個人的な意見で会社の公式見解ではない点にご注意ください。好きなものは XAML と C# 。苦手なものは型の無い言語です。

WinJSのデータバインドでコンバーターを使う(TypeScript使用)

TypeScriptのmoduleにコンバーターを定義する方法です。

WinJS.Binding.converter関数を使ってコンバーターを作成します。

module Converters {
    export var sampleConverter = WinJS.Binding.converter((value: string) => {
        return value + value;
    });
}

あとは、こんな感じでバインドするようにして

WinJS.UI.Pages.define("/pages/home/home.html", {
    ready: () => {
        WinJS.Binding.processAll(null, { name: "tanaka" });
    }
});

HTMLでdata-win-bindで、バインド先の属性名: バインドするプロパティ名 コンバーターの並びで書けばOKです。

<span data-win-bind="textContent: name Converters.sampleConverter"></span>

こうすると画面に

tanakatanaka

と表示されるようになります。