Knockout.js 将当前项引用传递给函数

在knockoutjs中，如何将当前项引用传递给函数

我有一个我正在循环的照片库，当用户单击照片时，我想检查用户选择的照片是否在img标记中有特定的类

这是我当前的代码，它不工作

my.Character = function () {
    var self = this;
    self.text = ko.observable();
    self.value = ko.observable();
    self.image = ko.observable();
    self.imageSrc= ko.computed(function () {
        return "/Images/" + self.image();
    }, this);
    self.selected = function ($data) {

        if ($data.hasClass('selected')) {
          // do stuff here
        };
};

景色

<div id="thumbnailsgall" data-bind='foreach: Characters'>
    <a data-bind="click: function () { getImage(); }, attr: { rel: image, id: value }" class="thumb_nail" href="#">         
       <img class="inactive" data-bind="click: function () { selected($data); }, attr: { src: imageSrc }" />  
    </a>
</div>

<div id="thumbnailsgall" data-bind='foreach: Characters'>
    <a data-bind="click: function () { getImage(); }, attr: { rel: image, id: value }" class="thumb_nail" href="#">         
       <img class="inactive" data-bind="click: $parent.select, attr: { src: imageSrc }, css :{'selected' : $parent.selected() === $data}" />  
    </a>
</div>

---

处理以下各项非常简单：

我假设在父上下文中有一个字符数组，它应该如下所示：

my.Parent = function(){
    var self = this;
    self.Characters = ko.observableArray();
    // stores the selected character
    self.selected = ko.observable();    
    self.select = function (character) {
        if(self.selected() === character)
            self.selected(null);
        else
            self.selected(character);
     };
};

my.Character = function () {

    self.text = ko.observable();
    self.value = ko.observable();
    self.image = ko.observable();
    self.imageSrc= ko.computed(function () {
        return "/Images/" + self.image();
    }, this);
};

景色

<div id="thumbnailsgall" data-bind='foreach: Characters'>
    <a data-bind="click: function () { getImage(); }, attr: { rel: image, id: value }" class="thumb_nail" href="#">         
       <img class="inactive" data-bind="click: function () { selected($data); }, attr: { src: imageSrc }" />  
    </a>
</div>

<div id="thumbnailsgall" data-bind='foreach: Characters'>
    <a data-bind="click: function () { getImage(); }, attr: { rel: image, id: value }" class="thumb_nail" href="#">         
       <img class="inactive" data-bind="click: $parent.select, attr: { src: imageSrc }, css :{'selected' : $parent.selected() === $data}" />  
    </a>
</div>

这就是为什么我可以写：

self.select = function (character) {};

---

你能添加视图吗？抱歉，Damien，一直在试图编辑我的帖子，但它没有显示我的更新。以下是视图：您只是忘记了在html中使用“示例代码{}”Hi Damien，仍然不能正常工作--您的代码将对用户单击的照片应用/切换.selected类，当用户单击照片时，允许用户多选照片（但我希望一次只选择一张照片）。将应用选定的类，但也将从库中的所有其他照片中删除选定的类。当做Melt@Melt向下，如果您希望同时只选择一张照片，则需要将所选角色存储在父上下文中。