knockout.filter

Usage

Install from NPM:

npm install knockout.filter --save

<script src="knockout.3.4.0.js"></script>
<script src="./node_modules/knockout.fitler/dest/knockout.filter.js"></script>

Syntax

<p data-bind="name | fitler_name arg1 arg2 ..."></p>

Example

Define a fitler:

ko.filter('uppercase', (str) => {
    return String(str).toUpperCase();
});

Define a view model:

ko.applyBindings({
    text: 'knockout.filter'
});

Use filter in template:

<p data-bind="text: text | uppercase"></p>

Arguments

Define a fitler with arguments:

ko.filter('wrap', (str, prefix = '', suffix = '') => {
    str = String(str);

    return `${prefix}${str}${suffix}`;
});

Use filter with arguments:

<p data-bind="text: text | wrap '(' ')'"></p>

Try

jsFiddle Demo

License

MIT © BinRui.Guan