knockoutjsを使用していくつかのテキストを複数化する方法はありますか

Question

テキストデータバインド式には、単一のプロパティのみを持つことができます。別のプロパティの数に応じて、いくつかのテキストを複数化するにはどうすればよいですか？

Answer 1

これを行うにはいくつかの方法があります。ここに示されているフィドルで2つの方法を示しました。 http://jsfiddle.net/njj2p/2/

私が示した最初のオプションは、KO.computedを使用して、評価に基づいて、名前を単数形または複数形で返す必要があるかどうかを判断することです。

  this.formattedName = ko.computed(function() {
        return this.qty() > 1 ? this.name() + "s" : this.name();
    }, this);

2番目のオプションは、計算されたプロパティなしでこれを行う方法を示し、代わりに条件付きバインディングを使用します。

<span data-bind="if:qty()>1">s</span>

Answer 2

次のように再利用可能なカスタムバインディングを作成できます。

ko.bindingHandlers.pluralize = {
  update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    function count(data) {
        var value = ko.utils.unwrapObservable(data);
        if (typeof value === "object" && value.length > 0) {
            return value.length;
        } else if (typeof value === "number") {
            return value;
        }
    }

    var settings = valueAccessor();
    var text = count(settings.data) === 1 ? settings.singular : settings.plural;
    $(element).text(ko.utils.unwrapObservable(text));
  }
};

このように使用します。

<span data-bind="pluralize: { data:items, singular:'entry', plural:'entries' }"></span>

• data オプションは、任意の配列または番号を指すことができます。
• singular オプションは、表示するテキストを表します data 1に評価します
• plural オプションは、それ以外の場合は表示されるテキストを表します。

ここで動作しているのをご覧ください。http://fiddle.jshell.net/jessegavin/wamfw/