[英]Passing $index and $data as arguments to function for click handler
我將$index
和$data
傳遞給change_model
函數。 該函數按以下順序期望2個參數:( (index, data)
。
從viewModel我傳遞click: $root.change_model.bind($data, $index())
。 在函數中, index
打印$data
,而data
打印index
:值相反。
self.change_model = function(index, data) {
self.patternSelectedIndex(index);
selected_door = data.file;
create_door();
};
<div data-bind="foreach: x.patterns">
<div class="thumbnail" data-bind="css: { selected: $index() === $root.patternSelectedIndex() }">
<img class='img model' style='width:164px;height:90px;padding:5px' data-bind="attr:{src:'images/models/' + $data.file + '.png'}, click: $root.change_model.bind($data, $index())" />
<div class="caption">
<span data-bind="text: $data.name"></span>
</div>
</div>
</div>
的第一個參數bind
將成為this
因為淘汰賽僅僅使用自己的函數中, 經常bind
功能 。
您可以傳遞$data
或$root
作為第一個( thisArg
)參數,也可以傳遞null或undefined,因為您實際上不需要它,因為您似乎使用了self = this
習慣用法。
例如:
var ViewModel = function () { var self = this; self.change_model = function (index, data) { console.log(this); console.log(index); console.log(data); // Actual code here }; self.x = { patterns: [{ file: 'some-file', name: 'some-name' }] }; }; ko.applyBindings(new ViewModel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> <div data-bind="foreach: x.patterns"> <button data-bind="click: $root.change_model.bind($data, $index(), $data)">Click me!</button> <span data-bind="text: $data.name"></span> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.