【问题标题】:Knockout typescript extenders淘汰打字稿扩展器
【发布时间】:2013-02-27 18:15:33
【问题描述】:

任何人都可以发布一个在打字稿中扩展可观察到的示例吗? 淘汰赛延长器:http://knockoutjs.com/documentation/extenders.html

我从 2013 年 3 月 6 日开始使用这个版本的 knockout.d.ts https://github.com/borisyankov/DefinitelyTyped/tree/master/knockout

编辑: 非常感谢!因此,要扩展您“只需”添加接口 KnockoutExtenders 以便打字稿将“允许”它。示例

interface KnockoutExtenders {
    logChange(target: any, option: string): KnockoutObservableAny;
}

ko.extenders.logChange = function (target, option) {
    target.subscribe(function (newValue) {
    console.log(option + ": " + newValue);
    });
return target;
};

在视图模型中声明如下:

this.score = ko.observable(score).extend({ logChange: "score" });

【问题讨论】:

    标签: knockout.js typescript


    【解决方案1】:

    typescript 中的接口是开放式的,因此您可以在多个位置添加它们。

    例如数字。您需要将此成员应用到扩展器以及您的 observables。这是一个例子:

    interface KnockoutExtenders {
        numeric(target: any, precision: number): KnockoutObservableAny;
    }
    interface KnockoutObservableNumber {
        extend(data: any): KnockoutObservableNumber;
    }
    ko.extenders.numeric = function (target: KnockoutObservableNumber, digits) {
        var result = ko.computed({
            read: function () {
                var value = target();
                var toret: string = value.toString();
                if (toret.length < digits) {
                    toret = "0" + toret;
                }
                else if (toret.length > digits) {
                    toret = toret.substring(0, digits);
                }
                return toret;
            },
            write: target
        });
    
        result(target());
        return result;
    };
    

    您可以在此处查看完整示例:https://github.com/basarat/ChessClock/blob/d82a565ac9720cce00c75f099fcf7003f496755a/ChessClock/ChessClock/www/main.ts

    【讨论】:

    • 我假设 KnockoutObservableAny 现在应该是 KnockoutObservable&lt;any&gt; 与支持泛型的更新打字稿/淘汰赛
    • KnockoutObservableNumber这里不再需要接口扩展(假设您使用的是.d.ts文件)-并且target应该是KnockoutObservable&lt;number&gt;
    【解决方案2】:

    根据评论更新:在这种情况下,您只需将接口单独扩展为定义文件即可:

    interface KnockoutExtenders {
        logChange: (target: KnockoutObservableAny, option: string) => KnockoutObservableAny;
    }
    

    【讨论】:

    • logchange 只是该特定示例中扩展方法的一个示例。在页面下方,他们展示了如何制作“必需”和“数字”。我们应该能够在 Typescript 中制作这些扩展器,但我不知道如何..
    • @RuneJeppesen - 我明白了 - 我认为它们是标准库的一部分。答案已更新。
    • 通过调整interface KnockoutExtenders { logChange: (target: KnockoutObservable&lt;any&gt;, option: string) =&gt; KnockoutObservable&lt;any&gt;; },我仍然收到一个错误,即类型 Knockout Extenders 上不存在 logChange(向我在 extensions.ts 顶部引用的类型文件添加了接口)。最新的 TS 有没有其他方法可以做到这一点?
    猜你喜欢
    • 2023-04-02
    • 1970-01-01
    • 2013-06-24
    • 2013-12-16
    • 1970-01-01
    • 2019-09-18
    • 2019-12-19
    • 2013-05-16
    • 2019-05-04
    相关资源
    最近更新 更多