Question

好的，这对我来说有点难以解释。我希望能够在TypeScript中执行以下操作：

(function() {
    (function($) {
        ...
    })(jQuery);
});

我知道当我创建一个TypeScript＆＃34; MyClass＆＃34;使用构造函数＆＃34;构造函数（$）{...}＆＃34;并导出这个类，它被编译成几乎相同，但我怎么能创建＆＃34;（jQuery）＆＃34;参数？我喜欢做的是在jQuery元素上调用myFunction：

$("#myDiv").MyClass.myFunction();

所以我在班上有这个元素并使用它。

Answer 1

你可以强制一个类作为jquery扩展，但我不推荐它。这是因为JQuery扩展依赖this作为当前JQuery对象，它是当前扩展函数调用的目标。

我建议你使用一个简单的功能。如果需要，可以在该函数中使用类。这是typescript中的基本jquery扩展：

// from jquery.d.ts
interface JQuery{}
declare var $:{(str:string):JQuery;fn:any;};

// Your code: 

// Basic jquery extension in TypeScript
interface JQuery{
    myFunction();
}
$.fn.myFunction = function(){
    console.log(this);
}

$("#myDiv").myFunction();

Answer 2

我认为这主要是一个关注点分离的问题。您的类应该包含jQuery插件的功能，而函数应该提供对该功能的访问。

module MyExtension {

    var $ = jQuery;

    export class MyClass {

        constructor (public $target: JQuery) {}

        public doSomething () {

            console.log('MyClass did something to', this.$target);
        }
    }

    export function jqueryPlugin () {

        return new MyClass(this).doSomething();
    }
}

if (jQuery) jQuery.fn.extend({ myExtension: MyExtension.jqueryPlugin });

TypeScript - 在元素上运行

2 个答案: