建立基本值轉換器

Created: November-22, 2018

雖然值轉換器可以由 toView 或 fromView 方法組成，但在下面的示例中，我們將建立一個基本的值轉換器，它只使用 toView 方法，該方法接受作為第一個引數傳送到檢視的值。

到 uppercase.js

export class ToUppercaseValueConverter {
    toView(value) {
        return value.toUpperCase();
    }
}

使用它：

export class MyViewModel {
    stringVal = 'this is my test string';
}

<template>
    <require from="./to-uppercase"></require>

    <h1 textContent.bind="stringVal | toUppercase"></h1>
</template>

我們標題中的一個元素的文字值應該是 THIS IS MY TEST STRING 這是因為 toView 方法接受檢視中的值並指定檢視應該獲取我們的新值，這是使用 String.prototype.toUpperCase()

在這種情況下，類名是 ToUppercaseValueConverter，其中 ValueConverter 告訴 aurelia 它是什麼（還有一種 Anotations 的方法，但我沒有在網際網路上找到一個例子）。因此 ValueConverter 在類名中是必需的，但是通過呼叫轉換器，這不再是必需的，因此你只需要在 html 模板中用 toUppercase 呼叫轉換器。