knockout.js 带参数的挖空点击绑定

0ve6wy6x 于 2022-11-10 发布在其他

关注(0)|答案(6)|浏览(204)

我正在尝试向我的按钮添加一个单击事件，该事件将仅在单击按钮时发送ID、Category和Name作为参数。

<tbody data-bind="foreach: tehTab()">
    <tr>
       <td data-bind="text: $data.Category"></td>
       <td data-bind="text: $data.Name"></td>
       <td>
          <button type="button" class="btn chart_btn" role="button" data-toggle="popover" data-trigger="focus" data-html="true" data-placement="right" container="body" tabindex="0" data-original-title="" title="" style="border:none; background-color:white" data-bind="attr: { id: $data.Id,'data-contentwrapper':'.chartdraw' + $data.Id},click: getLast7($data.Id, $data.Category, $data.Name) , text:$data.Value"></button>
         <div data-bind="css: 'chartdraw' + $data.Id" class="chartdrawetc" style="display:none">ASD</div>
       </td>
   </tr>
</tbody>

即使我试图改变：

click: getLast7($data.Id, $data.Category, $data.Name)

与

attr: { id: $data.Id ,onclick: getLast7($data.Id, $data.Category, $data.Name)

它仍然会触发getLast7方法，触发次数与tehTab的长度相同。
我做错了什么？

knockout.js

来源：https://stackoverflow.com/questions/40489808/knockout-click-binding-with-parameters

6条答案

按热度按时间

2ic8powd1#

在函数名后添加()将调用该函数。您必须使用.bind

click: getLast7.bind(this, $data.Id, $data.Category, $data.Name)

样品编号
第一个

赞(0）回复(0）举报 2022-11-10

lvmkulzt2#

即使你可以在你的点击绑定中用bind来修复它，我也不认为这是最好的解决方案。
click绑定将点击的模型传递给监听器 * 默认情况下 *。绑定将为每个项创建一个新函数，并将逻辑移动到视图中。
下面是一个例子：
第一个
如果需要将属性提取到参数列表，请创建一个额外的onClick函数：
第一个

赞(0）回复(0）举报 2022-11-10

7cwmlq893#

对于循环内的单击绑定，使用this获取当前行中条目的值。

<tbody data-bind="foreach: DataList">
 <tr>
  <td><input type="label" data-bind="text: Id"></td>
  <td><input type="label" data-bind="text: Category"></td>
  <td><input type="label" data-bind="text: Name"></td>
  <td><input type="button" data-bind="click: $parent.getCompleteDetails" value="View Details"/></td>   
 </tr>
</tbody>

在Knockout脚本中，使用此关键字获取当前行条目

self.DataList   =ko.observableArray([]); //this is used to populate the data entries.
  self.getCompleteDetails= function() {   
    alert(this.Id);
    alert(this.Category);
    alert(this.Name);
  }

赞(0）回复(0）举报 2022-11-10

ltskdhd14#

我总是用那个，效果很好。
HTML格式：

<input type="button" value="click to test" data-bind="click: $root.getCompleteDetails" />

浏览器：

getCompleteDetails: function (item, event) {
            // you can access all properties in item parameter 
        }

希望能帮上忙。

赞(0）回复(0）举报 2022-11-10

m528fe3b5#

您也可以简单地将click处理程序（在您的例子中是getLast 7） Package 在一个函数中。然后，您可以为它提供任何您想要的参数。来自$data的属性、自定义值甚至来自不同上下文的属性：
第一个

赞(0）回复(0）举报 2022-11-10

htrmnn0y6#

如果要保留原始绑定语法，请让视图模型中的函数返回一个函数。
第一个

赞(0）回复(0）举报 2022-11-10

我来回答

knockout.js 带参数的挖空点击绑定

6条答案

相关问题

热门标签

最新问答