如何在打字稿中定义淘汰赛绑定处理程序? [英] How do I define a knockout binding handler in typescript?

问题描述

我通常添加自定义 knockout 绑定处理程序 在 JavaScript 中通过

I normally add custom knockout binding handlers in JavaScript via

ko.bindingHandlers.myBindingHandler = {...}

但现在我必须通过

ko.bindingHandlers["myBindingHandler"] = {...}

否则我会收到此错误，因为我正在使用 typescript.d.ts:

otherwise I get this error because I'm using typescript.d.ts:

KnockoutBindingHandlers"类型的值不存在myBindingHandler"属性

The property 'myBindingHandler' does not exist on value of type 'KnockoutBindingHandlers'

我不喜欢 ["property"] 方法，因为那样我就无法引用它或稍后对其进行智能感知.

I don't like the ["property"] approach because then I can't reference it or get intellisense on it later.

那么，如何在使用 definelyTyped 的淘汰赛时将我的自定义绑定处理程序添加到淘汰赛中定义，同时还可以通过智能感知等引用我的定义?

So, how can I add my custom binding handler to knockout while using definitelyTyped's knockout definition, while also being able to reference my definition via intellisense, etc?

推荐答案

定义自定义绑定处理程序

它实际上很简单，只需在定义自定义绑定处理程序之前将它 (myBindingHandler) 添加到 KnockoutBindingHandlers 接口.请注意，从 1.0 版(或更早版本)开始，您必须在 .d.ts 文件中对界面进行添加.

Defining a custom binding handler

Its actually pretty easy, just add it (myBindingHandler) to the KnockoutBindingHandlers interface right before you define your custom binding handler. Please note that you have to do make this addition to the interface, within a .d.ts file as of version 1.0 (or possibly earlier).

bindingHandlers.d.ts

/// <reference path="typings/knockout/knockout.d.ts" />

interface KnockoutBindingHandlers {
    myBindingHandler: KnockoutBindingHandler;
}

myBindingHandler.ts

/// <reference path="bindingHandler.d.ts" />

ko.bindingHandlers.myBindingHandler = {...}

现在一切正常.这不会覆盖任何现有的定义或声明，因此您的定义将位于 ko.bindingHandlers.text 等旁边.

Now everything works. This will not overwrite any existing definitions or declarations, so your definition will sit along side of ko.bindingHandlers.text, etc.

请小心，因为如果您没有包含 myBindingHandler 的实际定义并且您在别处引用它，它会由于您添加到 KnockoutBindingHandlers 的定义而编译，但它会在运行时中断，因为没有 myBindingHandler 的实现.

Just be careful, because if you do not include an actual definition of myBindingHandler and you reference it elsewhere, it will compile due to the definition you added to KnockoutBindingHandlers, but it will break at runtime because there is no implementation of myBindingHandler.

在knockoutjs 中添加自定义绑定处理程序的文档是这里

The documentation for adding custom bindinghandlers in knockoutjs is here

同样，要在 ko.observable.fn 中添加一些内容，您可以在 typescript 中执行此操作

Similarly, to add something to ko.observable.fn, you'd do this in typescript

interface KnockoutObservableFunctions  { 
    myFnExtension(args: any): returnType; 
}

并用

// x will be defined as a returnType automatically, but you could specify it if you like, either way
var x: returnType = ko.observable("value").myFnExtension(args);

注意:subscribable、observable、observableArray 和 computed 类型有不同的接口:

Note: There are different interfaces for the subscribable, observable, observableArray, and computed types:

• ko.subscribable.fn ... 添加到 KnockoutSubscribableFunctions
• ko.observable.fn ... 添加到 KnockoutObservableFunctions
• ko.observableArray.fn ... 添加到 KnockoutObservableArrayFunctions
• ko.computed.fn ... 添加到 KnockoutComputedFunctions

• ko.subscribable.fn ... add to KnockoutSubscribableFunctions
• ko.observable.fn ... add to KnockoutObservableFunctions
• ko.observableArray.fn ... add to KnockoutObservableArrayFunctions
• ko.computed.fn ... add to KnockoutComputedFunctions

在knockoutjs 中添加到fn 的文档是这里

The documentation for adding onto fn in knockoutjs is here

这篇关于如何在打字稿中定义淘汰赛绑定处理程序?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！