0

尝试学习 Knockoutjs。我发现了一个 Knockoutjs 自定义绑定相关的代码，但这不是很好。

<input data-bind="value: name" />
<hr/>
<div data-bind="fadeInText: name"></div>

ko.bindingHandlers.fadeInText = {
    update: function(element, valueAccessor) {
        $(element).hide();
        ko.bindingHandlers.text.update(element, valueAccessor);
        $(element).fadeIn(); 
    } 
};

var viewModel = {
    name: ko.observable("Bob")
};

ko.applyBindings(viewModel);

我只是不明白人们什么时候去自定义绑定？

1）如果可能的话，请告诉我一些情况何时可以选择自定义绑定？

2）如果有人看到代码，那么他们可以理解自定义绑定 fadeInText 和 viewModel 没有关系，但它仍然有效。如何 ？

3）如果会有多个视图模型，那么我如何在绑定时指定带有绑定名称的视图模型名称？

以上代码的jsfiddle链接http://jsfiddle.net/rniemeyer/SmkpZ/

4）如何在没有自定义绑定的情况下实现相同的输出？有可能吗？

请明智地回答我的问题。谢谢

4

1 回答 1

4

这里有几个答案：

  1. 自定义绑定在许多情况下都很有用，在我看来，不应将其用作最后的手段。任何时候如果您想以内置绑定尚不支持的方式连接您的 DOM 和数据，那么它们是一个不错的选择。正如我上面列出的，这是一篇可以帮助澄清的文章。

  2. 自定义绑定通过调用间接与视图模型建立关系ko.bindingHandlers.text.update。因此，它有效地包装了实际的text绑定。text绑定读取传入的值并显示。

  3. 对于多个视图模型，此答案描述了处理多个视图模型的一些选项。

  4. 如果没有自定义绑定，您可以选择不使用 jQuery 并使用 CSS（考虑浏览器支持和前缀）。例如，您可以立即将一个类添加到一个元素，例如：

使用 CSS 如下：

.message {
    opacity: 0;
    transition: opacity 2s ease-in;
}

.load {
    opacity: 1;
}

该元素将从开始opacity: 0并立即过渡到opacity: 1超过 2 秒。

我不建议在您的视图模型中直接使用 jQuery。自定义绑定是适用于这些场景的工具，并提供了 Knockout 提供的大部分功能。

希望这可以帮助。

于 2015-05-15T16:23:10.620 回答