0

この例では、1 つのカウンターを非常に簡単に作成できます。これを 1 つのページで複数回使用するにはどうすればよいですか?

<div>
    You've clicked <span data-bind="text: numberOfClicks"></span> times
    <button data-bind="click: incrementClickCounter">Click me</button>
</div>

<script type="text/javascript">
    var viewModel = {
        numberOfClicks : ko.observable(0),
        incrementClickCounter : function() {
            var previousCount = this.numberOfClicks();
            this.numberOfClicks(previousCount + 1);
        }
    };
</script>

ありがとう!

4

2 に答える 2

1

In that case you can make use of javascript closures.

function Counter(){
    var self = this;
     self.numberOfClicks = ko.observable(0);
     self.incrementClickCounter = function() {
        self.numberOfClicks(self.numberOfClicks() + 1);
    };
}

var viewModel = {
     counter1: new Counter(),
     counter2: new Counter()
};

http://jsfiddle.net/marcandrew/wckE2/

于 2013-02-25T20:42:49.147 に答える
0

1 つのページでこれを複数回使用することで、あなたが何を意味するのか正確に理解できませんか? すべてのインスタンスでクリック回数を共有するか、それとも互いに独立させるか?

単に共有している場合は、複数の要素を同じクリック イベントにバインドできます。

<div>
    You've clicked <span data-bind="text: numberOfClicks"></span> times
    <button data-bind="click: incrementClickCounter">Click me</button>
    <button data-bind="click: incrementClickCounter">Click me Too</button>
</div>
于 2013-02-25T19:08:57.973 に答える