如何在打字稿中调用自有函数

时间:2018-12-05 10:11:11

标签: typescript

我正在为客户端语言编写打字稿,几天前我才刚开始学习打字稿,但是有一个问题使我发疯。我不能在此类内使用函数。

这是打字稿:

   declare var $: any;
declare var query: any;

class Utilities {

    checkLoginStatus(): void {
          query.sendRequest("POST", "/loginRegister/checkLoginStatus", "", function (data) {
        var loginStatusDiv = $("#login_status");
        loginStatusDiv.html("");
        if (data.status) {
            loginStatusDiv.append($("<span>", { text: "Welcome " + data.user_name, class: "col-8 text-right" }));
            loginStatusDiv.append($("<a>", { href: "#", text: "Logout", id: "logout_link", class: "col-4 text-right" }));
            this.handleLogoutClick();
        } else {
            loginStatusDiv.append($("<a>", { href: "login.html", text: "Login", id: "login_link", class: "col-8 text-right" }));
            loginStatusDiv.append($("<a>", { href: "register.html", text: "Register", id: "register_link", class: "col-4 text-right" }));
        }
    });
    }

    handleLogoutClick(): void {
       //some actions

    }
}

let utilities = new Utilities();
utilities.checkLoginStatus();

这是Javascript:

var Utilities = /** @class */ (function () {
    function Utilities() {
    }
    Utilities.prototype.checkLoginStatus = function () {
              query.sendRequest("POST", "/loginRegister/checkLoginStatus", "", function (data) {
        var loginStatusDiv = $("#login_status");
        loginStatusDiv.html("");
        if (data.status) {
            loginStatusDiv.append($("<span>", { text: "Welcome " + data.user_name, "class": "col-8 text-right" }));
            loginStatusDiv.append($("<a>", { href: "#", text: "Logout", id: "logout_link", "class": "col-4 text-right" }));
            this.handleLogoutClick();
        }
        else {
            loginStatusDiv.append($("<a>", { href: "login.html", text: "Login", id: "login_link", "class": "col-8 text-right" }));
            loginStatusDiv.append($("<a>", { href: "register.html", text: "Register", id: "register_link", "class": "col-4 text-right" }));
        }
    });

    };
    Utilities.prototype.handleLogoutClick = function () {

    };
    return Utilities;
}());
var utilities = new Utilities();
utilities.checkLoginStatus();

这是query.sendRequest

declare var $: any;
namespace query {
    export function sendRequest(method, api, praValue, callback): void {
        $.ajax({
            type: method,
            url: window.location.origin + api,
            data: { data: praValue },
            success: callback,
            error: function (e) {
                console.log(e.statusText);
            }
        });
    }
}

这是错误:

Utilities.js:11 Uncaught TypeError: this.handleLogoutClick is not a function

它说this.handleLogoutClick不是一个函数。我以为打字稿是一种类似于Java的语言,但是我不知道如何调用此类的函数。

任何帮助将不胜感激。 谢谢!

1 个答案:

答案 0 :(得分:1)

我刚刚找到了一种在打字稿中使用jquery的方法

handelLoginBtnClick(): void {
        var _this = this;
        $('#login_btn').on('click', function () {
            var input = $('.validate-input .user_input');
            for (var i = 0; i < input.length; i++) {
                _this[$(input[i]).attr("id")] = $(input[i]).val();
            }
            if ($(this).data("is-login")) {
                query.sendRequest("POST", "/loginRegister/login", JSON.stringify(_this), function (data) {
                    _this.handelFallback(data);
                });
            } else {
                if ($(".sign_up_as")) {
                    _this["sign_up_as"] = $("input[name='sign_up_as']:checked").val();
                }
                query.sendRequest("POST", "/loginRegister/register", JSON.stringify(_this), function (data) {
                    _this.handelFallback(data);
                });
            }
            console.log(userLogin);
        });
    }

声明一个类似变量 var _this = this, jQuery代码之前。 _this will represent as this class,

$(this) will be the jQuery object.

如果我错了,请纠正我。