导航到其他选项卡时,无法销毁敲除绑定(MetroJS)

时间:2018-09-26 02:20:49

标签: typescript knockout.js kendo-ui gridstack

我正在使用打字稿和淘汰赛。在我的示例中,我可以使用kendo自定义编辑器(例如淡入淡出或轮播)创建图块并设置交易。根据为图块设置的计时器,将显示数据。但是,当我导航到其他选项卡时,timer事件尝试查找不再可用的切片数据,从而引发错误。我想确保当导航到其他选项卡时,所有具有事务事件的图块都必须销毁或取消绑定。我已经尝试过使用ko.utils.domNodeDisposal.addDisposeCallback(element,function(),但是它从未被调用。

 init: (element: any, valueAccessor: any, allBindings: any, viewModel: any, bindingContext: any): void => {

        tileState.editableTileInit(element, valueAccessor, viewModel);
        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
            console.log("I have been called");
        });
    },
    update: (element: any, valueAccessor: any, allBindings: any, viewModel: any, bindingContext: any): void => {

        tileState.editableTileUpdate(element, valueAccessor, viewModel);
    }

init方法将创建图块

if (viewModel.editMode() === true) LiveTiles.setupClickHandler(element, viewModel, true);

var sub = viewModel.editMode.subscribe(x => LiveTiles.setupClickHandler(element, viewModel, x));

ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
    sub.dispose();
    TileEditor.destroyEditor(element, viewModel);
    LiveTiles.destroyTile(element, viewModel);
});
如果用户在运行时更新图块,则

update方法将更新图块。

 TileEditor.destroyEditor(element, viewModel);
    LiveTiles.createTile(element, viewModel);
    if (LiveTiles.shouldRecreateClickHandler(viewModel) === true) {
        LiveTiles.setupClickHandler(element, viewModel, viewModel.editMode());
    }

Tile window

Error when navigated to other tabs

2 个答案:

答案 0 :(得分:0)

如果您想知道用户何时切换到另一个选项卡(通常在窗口外),则可以在blur上捕获window事件:

$(window).blur(() => console.log("window.blur"));

答案 1 :(得分:0)

需要在所需的.ts文件中的内部处置中调用此代码。因此,每当用户导航时,都会调用dispose方法,下面的代码将确保Metrojs CSS被删除。

$('.live-tile')['liveTile']("destroy", true);