knockout.js - knockoutjs - ko observable();

¿Cómo se define un controlador de enlace nocaut en mecanografiado?

Question

Normalmente agrego manipuladores vinculantes personalizados en JavaScript a través de

ko.bindingHandlers.myBindingHandler = {...}

pero ahora tengo que agregarlos en TypeScript través de

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

de lo contrario, obtengo este error porque estoy usando typescript.d.ts :

La propiedad ''myBindingHandler'' no existe en el valor de tipo ''KnockoutBindingHandlers''

No me gusta el enfoque ["property"] porque entonces no puedo hacer referencia a él ni obtener intelisense sobre él más adelante.

Entonces, ¿cómo puedo agregar mi manejador de encuadernación personalizado para nocaut mientras uso la definición de definición definitiva de definitionTyped , al mismo tiempo que puedo hacer referencia a mi definición a través de intellisense, etc.?

Answer 1

Definición de un controlador de enlace personalizado

De hecho, es bastante fácil, solo myBindingHandler ( myBindingHandler ) a la interfaz KnockoutBindingHandlers justo antes de definir tu controlador de enlace personalizado . Tenga en cuenta que debe hacer esta adición a la interfaz, dentro de un archivo .d.ts partir de la versión 1.0 (o posiblemente antes).

bindingHandlers.d.ts

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

interface KnockoutBindingHandlers {
    myBindingHandler: KnockoutBindingHandler;
}

myBindingHandler.ts

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

ko.bindingHandlers.myBindingHandler = {...}

Ahora todo funciona. Esto no sobrescribirá las definiciones o declaraciones existentes, por lo que su definición se ubicará junto a ko.bindingHandlers.text , etc.

Solo tenga cuidado, porque si no incluye una definición real de myBindingHandler y la referencia en otro lugar, se compilará debido a la definición que agregó a KnockoutBindingHandlers , pero se interrumpirá en tiempo de ejecución porque no hay implementación de myBindingHandler .

La documentación para agregar manipuladores de encuadernación personalizados en knockoutjs está aquí

Usando fn para agregar funciones personalizadas con TypeScript

Del mismo modo, para agregar algo a ko.observable.fn , harías esto en mecanografiado

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

y llámalo con

// 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);

Nota: Existen diferentes interfaces para los tipos subscribable , observable , observableArray y computed :

• ko.subscribable.fn ... agregar a KnockoutSubscribableFunctions
• ko.observable.fn ... agregar a KnockoutObservableFunctions
• ko.observableArray.fn ... agregar a KnockoutObservableArrayFunctions
• ko.computed.fn ... agregar a KnockoutComputedFunctions

La documentación para agregar a fn en knockoutjs está here

Answer 2

Otra manera sucia de ignorar cualquier tipo de comprobación de tipo:

let bindingHandlers: any = ko.bindingHandlers;
bindingHandlers.myHandler = {...}

Answer 3

simplemente puede ignorarlo , pero esta no es una buena práctica , ya que al myBindingHandler no está definiendo el tipo de la propiedad myBindingHandler

(<any>ko.bindingHandlers).myBindingHandler = { ... };