2

在 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>
4

1 回答 1

1

使用css 绑定非常简单：

我想您在父上下文中有一个 Characters 数组，应该如下所示：

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: $parent.select, attr: { src: imageSrc }, css :{'selected' : $parent.selected() === $data}" />  
    </a>
</div>

请注意，KO 在调用 select 函数时会隐式传递绑定的视图模型和事件（单击：$parent.select）。在其他人的 KO 电话中

$parent.select($data, clickEvent)

这就是为什么我可以写：

self.select = function (character) {};
于 2013-11-09T15:41:22.120 回答