NativeScript

Question

我正在使用 NativeScript 6.4.1 和 Angular 8 编写应用程序。

我在我的项目中加入了 SideDrawer 功能。

https://docs.nativescript.org/ui/components/SideDrawer/getting-started 到目前为止效果很好。

我注意到的一件事是，当我注销应用程序时，我通过 SideDrawer 注销，然后转到应用程序的第一页。这种从侧抽屉到主页的过渡不是很顺利。

我怎样才能等到侧抽屉关闭后再进行布线，或者使过渡更顺畅？

示例代码：

export class LogoutService {

    constructor(private routerExtensions: RouterExtensions, private sideDrawerService: SideDrawerService) {}

    public logout(): void {
        appSettings.clear();
        this.sideDrawerService.closeDrawer();
        this.routerExtensions.navigate(['landing-page'], { clearHistory: true });
    }

}

export class SideDrawerService {

    constructor() {}

    public showSideDrawer() {
        const sideDrawer = app.getRootView() as RadSideDrawer;
        sideDrawer.showDrawer();
    }

    public closeDrawer() {
        const sideDrawer = app.getRootView() as RadSideDrawer;
        sideDrawer.closeDrawer();
    }

}

编辑：我可以在此处的文档中看到，在 https://docs.nativescript.org/ns-ui-api-reference/classes/radsidedrawer#drawerclosedevent

时会触发一些事件

如何监听这些事件？

我尝试过类似的方法，但它不起作用：

public closeDrawerAsync() {

    const sideDrawer = app.getRootView() as RadSideDrawer;

    sideDrawer.drawerClosedEvent //this does not seem to exist

}

Answer 1

使用drawerClosed事件

export class SideDrawerService {
    ...
    closeDrawer (callback?: () => void) {
       const sideDrawer = app.getRootView() as RadSideDrawer;
       if (callback) {
         callback = zonedCallback(callback);
         sideDrawer.once(RadSideDrawer.drawerClosedEvent, () => {
             callback();
         });
       }
       sideDrawer.closeDrawer();
    }
    ...
}

现在你可以像这样使用它了，

public logout(): void {
    appSettings.clear();
    this.sideDrawerService.closeDrawer(()=> {
       this.routerExtensions.navigate(['landing-page'], { clearHistory: true });
    });
}

NativeScript - 如何延迟路由直到侧边抽屉关闭？

NativeScript - how to delay routing until the sidedrawer has closed?

angular