更改可观察数组会更改自定义绑定处理程序knockout.js的可见性

有组织的

更新: JSFiddle http://jsfiddle.net/OrganicCat/CjH87/6/

我有一个由普通可观察数组填充的区域,单击按钮时,将进行异步服务调用,以重新填充该数组,但包含更多数据。

这也会导致显示一个隐藏的dom元素,并在其中显示该数组数据中的一些。

一切正常,直到可观察的数组数据更新,它关闭了隐藏的dom元素。正是它在Knockout.js(library)内部触发该事件:

// Ignore writes if the value hasn't changed
    if ((!observable['equalityComparer']) || !observable['equalityComparer'](_latestValue, arguments[0])) {
    observable.valueWillMutate();
    _latestValue = arguments[0];
    if (DEBUG) observable._latestValue = _latestValue;
    observable.valueHasMutated(); // This event HERE

有没有办法防止这种情况关闭自定义绑定?绑定中的任何内容可能会导致这种情况吗?这是我的自定义绑定处理程序:

ko.bindingHandlers.expandAmenities = {
                init: function (element) {
                    $('.expandable.closed').hide();
                    $('.itineraryRowMain .t-go .toggle-expand-rowAmenities').unbind('click').on('click', function (e) {

                        var $itin_body = $(this).closest('.module-admin-group');
                        if ($itin_body.hasClass('closed')) {
                            $(this).parent().parent().next().show();
                            self.bindAmenities(); // Bind amenity details on open
                            //$(this).children().html('-');
                        } else {
                            $(this).parent().parent().next().hide();
                            //$(this).children().html('+');
                        }
                        $itin_body.toggleClass('open closed');
                    });
                }
            };

总而言之,扩展区域具有可单击的元素,它将显示更多数据。当这更新数组时(只是一个普通的旧self.listofStuff(arr);),这将导致新区域再次被隐藏。

有组织的

我已经找到答案了。因此,问题在于,如果您绑定一个生成DOM元素的数组(如列表或其他内容),并且该数组中有要更新的元素,而无需执行.push且无需使用self.myArray(newArray ),则必须在数组中使用可观察变量并对其进行更新。

当您修改可观察对象时,它不会重绘整个数组,从而使动态更改的元素(如DOM数组中的可见/隐藏的div)保持相同的状态(如果通过jQuery或其他方式对其进行了更改)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用敲出.js的可见性样式绑定失败

来自分类Dev

使用敲出.js的可见性样式绑定失败

来自分类Dev

Android:TextView可见性更改

来自分类Dev

div的可见性更改

来自分类Dev

TextView可见性更改通知

来自分类Dev

绑定到按钮可见性

来自分类Dev

ListViewItem的绑定可见性

来自分类Dev

可见性绑定失败

来自分类Dev

绑定可见性属性

来自分类Dev

与列表项的可见性绑定

来自分类Dev

绑定到 css 可见性

来自分类Dev

类定义的可见性

来自分类Dev

python中的数组可见性

来自分类Dev

当父THREE.js组的可见性更改时,更改CSS2D对象的可见性

来自分类Dev

绑定-空事件名称/更改可见性

来自分类Dev

为什么不能使用jquery / css / js更改可见性?

来自分类Dev

为什么不能使用jquery / css / js更改可见性?

来自分类Dev

在HTML和JS中更改可见性属性的怪癖

来自分类Dev

数组值更改的线程可见性

来自分类Dev

根据在Knockout.JS中选择的下拉值设置文本框的可见性

来自分类Dev

React.js处理可见性=隐藏的方式是什么?

来自分类Dev

如何在TextInputLayout Android中更改setEndIconDrawable的可见性(可见,不可见或不可见)?

来自分类Dev

易失性数组-元素的内存可见性

来自分类Dev

如何在更改可见性的同时更改背景?

来自分类Dev

Java全局异常处理程序中的可见性

来自分类Dev

Java全局异常处理程序中的可见性

来自分类Dev

Android:在recyclerView中更改视图的可见性

来自分类Dev

在WPF控件可见性更改上应用动画

来自分类Dev

LayoutTransitions不适用于可见性更改