Question

我有以下的TypeScript类。

export class BrandViewModel {

        private _items = ko.observableArray();

        public Add(id: number, name: string, active: boolean) : void {
            this._items.push(new BrandItem(this, id, name, active));
        }

        public Get() : void  {
            $.get("/api/brand", function(items) {
                $.each(items, function (i, item) {
                        this.Add(item.Id, item.Name, item.Active);
                    });
            }, "json");
        }
}

Get方法生成的javascript为：

    BrandViewModel.prototype.Get = function () {
        $.get("/api/brand", function (items) {
            $.each(items, function (i, item) {
                this.Add(item.Id, item.Name, item.Active);
            });
        }, "json");
    };

我在TypeScript文档中看到我可以这样做：

    public Get() : void  {
        $.get("/api/brand", () => function(items) {
            $.each(items, function (i, item) {
                    this.Add(item.Id, item.Name, item.Active);
                });
        }, "json");
    }

结果如下所示，其中_this现在是对BrandViewModel实例的引用，但jquery this函数内的.each未更改为{{1}正如我所料：

_this

相反，我在BrandViewModel.prototype.Get = function () { var _this = this; $.get("/api/brand", function () { return function (items) { $.each(items, function (i, item) { this.Add(item.Id, item.Name, item.Active); }); }; }, "json"); };中完成了以下操作：

TypeScript

给了我想要的结果：

    public Get(): void {
        var _this = this;
        $.get("/api/brand", function(items) {
            $.each(items, function (i, item) {
                    _this.Add(item.Id, item.Name, item.Active);
                });
        }, "json");
    }

有没有人知道更合适的方法呢？

Answer 1

你可以这样做：

    public Get() : void  {
        $.get("/api/brand", (items) => {
            $.each(items, (i, item) => {
                    this.Add(item.Id, item.Name, item.Active);
                });
        }, "json");
    }

生成：

    BrandViewModel.prototype.Get = function () {
        var _this = this;
        $.get("/api/brand", function (items) {
            $.each(items, function (i, item) {
                _this.Add(item.Id, item.Name, item.Active);
            });
        }, "json");
    };

Answer 2

与ECMAScript 6 arrow functions一致，当使用=＆gt;时，TypeScript会以词汇方式绑定它。

在jquery函数范围内的类上的TypeScript调用方法

2 个答案: