angular 4 - 使用在jquery里面纠正这个问题

Question

我在ui-sortable内部使用jquery ngOnInit工作正常，但是在更新后我想调用服务方法，但this没有引用组件class，那么如何让它引用组件类？

$('tbody').sortable({

        items: "tr:not('.home')",
        placeholder: "ui-state-hightlight",
        update: function () {
            var ids = $('tbody').sortable("serialize");
            this.pagesService.postReorderPages(ids).subscribe(); // how to make THIS here refer to current component class?
        }

    });

Answer 1

尝试使用arrow syntax代替function()：

$('tbody').sortable({

    items: "tr:not('.home')",
    placeholder: "ui-state-hightlight",
    update: () => {
        var ids = $('tbody').sortable("serialize");
        this.pagesService.postReorderPages(ids).subscribe(); // now `this` should refers to the component class
    }

});

或者您可以在bind(this)之后添加function()：

$('tbody').sortable({

    items: "tr:not('.home')",
    placeholder: "ui-state-hightlight",
    update: function() {
        var ids = $('tbody').sortable("serialize");
        this.pagesService.postReorderPages(ids).subscribe(); // now `this` should refers to the component class
    }.bind(this)

});