Question

我有一个列出可观察数组元素的表。遇到困难的地方是，当按钮点击按钮改变颜色的项目并更改为“选择”的值时，如果再次单击按钮则反转。我已经成功地将按钮文本颜色作为测试绑定到当前$ data中的属性。当我点击并更改属性值时，没有任何反应。

问题出现的是按钮标签。

示例代码：

<tbody data-bind="foreach: slcs ">
<tr>
    <td data-bind="text: slc"></td>
    <td>
        <div class="form-group">
            <select class="form-control input-sm runinputs" data-bind="selectedOptions: $data.pbr, optionsCaption: 'Choose'">
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
        </div>
    </td>
    <td>
        <div class="form-group">
            <select class="form-control input-sm runinputs" data-bind="selectedOptions: $data.of, optionsCaption: 'Choose'">
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
        </div>
    </td>
    <td>
        <div class="form-group">
            <select class="form-control input-sm runinputs" data-bind="selectedOptions: $data.lotsize, optionsCaption: 'Choose'">
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
        </div>
    </td>
    <td><button class="btn btn-sm btn-info" data-bind="click: $data.status = 0,  click: function() { $parent.selectSetting($data); }, style: { color: $data.status = 0 ? 'red' : 'black' }">Select</button></td>
</tr>

Answer 1

我不知道你的父模型是什么样的，或selectSetting应该完成什么，但我确实注意到了

<button class="btn btn-sm btn-info" data-bind="click: $data.status = 0,  click: function() { $parent.selectSetting($data); }, style: { color: $data.status = 0 ? 'red' : 'black' }">

您的第一个click绑定会将项目状态设置为0，但不会切换它。这就是一个问题。

另一个问题出在style部分，您有=而不是==。

淘汰赛 - foreach：点击时更改按钮颜色

1 个答案: