将jquery库函数写入typescript

时间:2016-04-27 00:54:41

标签: javascript jquery angularjs typescript

我已经使用typescript编写了一个指令。代码看起来像这样。

'use strict';

module App.Directives {

    interface IPageModal extends ng.IDirective {
    }

    interface IPageModalScope extends ng.IScope {
        //modal: any;
    }

    class PageModal implements IPageModal {
        static directiveId: string = 'pageModal';
        restrict: string = "A";

        constructor(private $parse: IPageModalScope) {
        }

        link = (scope: IPageModalScope, element, attrs) => {

            element.on('click', function (event) {
                event.preventDefault();

                var options = {
                    backdrop: 'static',
                    keyboard: false
                };
                event.openModal = function () {
                    $('#' + attrs['targetModal']).modal(options);//error
                };
                event.showModal = function () {
                    $('#' + attrs['targetModal']).modal('show');//error
                };
                event.closeModal = function () {
                    $('#' + attrs['targetModal']).modal('hide');//error
                };
                var fn = this.$parse(attrs['pageModal']);
                fn(scope, { $event: event });
            });
        }
    }

    //References angular app
    app.directive(PageModal.directiveId, ['$parse', ($parse) => new PageModal($parse)]);
}

当我调用jquery bootstrap .modal函数时,会发生错误。我怎样才能在下面调用此功能

  

$('#' + attrs [' targetModal'])。modal(' hide'); //错误代码行

1 个答案:

答案 0 :(得分:1)

  

jquery bootstrap .modal函数然后发生错误

如果是编译时错误,则需要类型定义。更多:https://basarat.gitbooks.io/typescript/content/docs/types/ambient/d.ts.html

修复

foo.d.ts中的快速:

interface JQuery {
  modal: any;
}