Jquery 在Knockoutjs自定义绑定中创建幻灯片切换转换

尝试使用滑动转换切换显示在虚拟元素中的模板。当向下滑动转换工作时，我需要帮助，请向上滑动。基本上，当虚拟元素出现时，其中的模板会自动滑入，当 虚拟元素隐藏了应该向上滑动的子模板

我猜解决方案应该真正使虚拟元素本身向上/向下滑动，而不是子模板

---

这就是你想要的吗？看这把小提琴

以及HTML：

<script type="text/html" id="tpl">
    <div>Hello world !!</div>
</script> 

<a href="#" data-bind="slideInTemplate: { kotemplate: 'tpl'}">Toggle</a>

---

绑定处理程序中有几个问题：

ko.bindingHandlers.slideInTemplate = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
      return ko.bindingHandlers['template']['init'](element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);  

在此之后的任何内容都不会在init函数中执行。从前面的语句中去掉返回值

    var value = valueAccessor();

这里的值将是传递给绑定的对象，例如{name:tpl}。您需要获取相应成员的值，即

    var value = valueAccessor().name;

这里也一样

    ko.unwrap(value) ? $(element).slideDown() : $(element).slideUp(); 
} 

---

})

检查$element.is:visible可能会帮助您解决此问题这是最接近我要求的解决方案：，只需要集成ifNotFade的选项…抱歉，我给出的单击切换示例是方便地在true和false之间更改可观察值。在生产版本中，此值由单击事件以外的事件确定。最好让此转换与虚拟元素一起工作。请参阅我的新注释：恐怕没有区别：。我认为问题在于父虚拟元素会立即关闭其自身的可见性，从而没有给模板足够的时间来显示向上滑动效果。

    var value = valueAccessor();

    var value = valueAccessor().name;

update: function(element, valueAccessor, allBindingsAccessor, viewModel, context) {
    $(element).hide();
    ko.bindingHandlers.template.update(element, valueAccessor, allBindingsAccessor, viewModel, context);
    var value = valueAccessor();

    ko.unwrap(value) ? $(element).slideDown() : $(element).slideUp(); 
}