javascript - 如果值相等则 knockout 函数

Question

我尝试滚动到 ul 中通过 knockout 制作的元素。如果条件为真，则 Div 应滚动到 Element。

我的代码是:

    <div id="container">
                    <table>
                        <tbody data-bind="foreach: sequence">
                        <tr>
                            <td>M<span data-bind="text: $index"></span></td>
                            <td>
                                <ul data-bind="foreach: $data" class="verticalList">
                                    <li data-bind="css: {activeElement: $index()==simulator.activeIndex() && $parentContext.$index() ==simulator.machineIndex()}">
                                        <span >⊢</span>
                                        <span data-bind="text: $data.string, css: {some Condition}"></span>
                                    </li>
                                </ul>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>

我想要的:

如果 $parentContext.$index() ==simulator.machineIndex() ，应该能够调用 li 上的函数，这给了我 li-元素，以便我可以滚动到它。

感谢您的帮助。

Answer 1

我认为custom binding handler就是您要找的:

ko.bindingHandlers.elementScroller = {
    update: function(element, valueAccessor, allBindings) {
        // First get the latest data that we're bound to
        var value = valueAccessor();

        // Next, whether or not the supplied model property is observable, get its current value
        var active = ko.unwrap(value);
        if (active) {
            // Now scroll some diff to this element
            $('#someScrollingDiv').animate({top: $(element).position().top});
        }
    }
};

在你的 HTML 中:

<li data-bind="elementScroller: $index()==simulator.activeIndex() && $parentContext.$index() ==simulator.machineIndex(), css: {activeElement: $index()==simulator.activeIndex() && $parentContext.$index() ==simulator.machineIndex()}">