SAPUI5 / OPENUI5 - 使用对话框进行路由

时间:2015-06-11 15:47:34

标签: routing dialog sapui5

我目前仍然坚持使用路由和对话框的组合。 我有一个列表元素的视图,当我单击列表中的元素时,我希望详细信息视图显示在对话框(弹出窗口)中。 问题是,我还想要我的网址中列表元素的ID,当我在对话框仍然打开时重新加载页面时,我想再次跳转到这个确切的位置(对话框是全屏的,它看起来像一个自己的视图)。

所以,到目前为止我得到了什么:

当我点击列表中的某个元素时,我会调用此函数

campaignSelectHandler : function () {
    if(!this.fragment) {
        var controller = new sap.ui.controller("ui.controls.fragments.EventDetail");
        this.fragment = sap.ui.xmlfragment("ui.controls.fragments.EventDetail", controller);
    }
    //this.router.navTo(navigation.Constants.EventDetailFragment, {id : 12345});
    this.router.navTo(navigation.Constants.EventDetailFragment, {id: 1337});
    this.fragment.open();
},

接下来我跳到我的片段

<Dialog     id="dialogEventDetail"
        xmlns:view="ui.views.pages"
        xmlns="sap.m"
        xmlns:controls="ui.controls"
        xmlns:core="sap.ui.core"
        xmlns:mvc="sap.ui.core.mvc"
        contentWidth="100%" contentHeight="100%"
        showHeader="false"
        class="eventDetail"
        horizontalScrolling="false"
        verticalScrolling="false">

<mvc:XMLView viewName="ui.views.pages.EventDetail">

</mvc:XMLView>

</Dialog>

在这个Dialog片段中,我加载了我的视图,包括我的控制器等。 这适用于打开一个Dialog并显示url路径,但很明显,一旦我重新加载页面,一切都消失了。

除此之外,我还从我启动路由器的AbstractController扩展了“ui.views.pages.EventDetail”视图。它适用于我的普通视图,但是当我打开对话框时,我松开了它的引用,无法返回到我的初始视图。

我知道这个解决方案不起作用所以我希望你对如何让它工作有一些建议!

提前致谢!

BTW:这是Component.js

routes : [
            {
                pattern : "",
                name : navigation.Constants.MyEvents,
                view : navigation.Constants.MyEvents,
                viewId : navigation.Constants.MyEvents,
                targetAggregation : "pages",
                targetControl : "idAppControl",
                subroutes : [
                    {
                        pattern : "{id}",
                        name : navigation.Constants.EventDetailFragment,
                        view : navigation.Constants.EventDetailFragment
                    }
                ]
            }

1 个答案:

答案 0 :(得分:1)

在刷新时调用attachRouteMatched方法。

onInit: function() {
    var _this = this
    var oRouter = sap.ui.core.routing.Router.getRouter("appRouter");
    //can also use directly this.oRouter.attachRouteMatched(...)
    //I see you using this.router 
    oRouter.attachRouteMatched(function(oEvent) {
        if (oEvent.getParameter("name") !== navigation.Constants.EventDetailFragment) {
            return:
        }
        try {

            var oHasher = new sap.ui.core.routing.HashChanger();
            var hash = oHasher.getHash(); //this will get everything which is in URL after #
            //TODO : split the hash accordingly and find the event id and open your dialog and assign to oEventId
            if (!_this.fragment) {
                var controller = new sap.ui.controller("ui.controls.fragments.EventDetail");
                _this.fragment = sap.ui.xmlfragment("ui.controls.fragments.EventDetail", controller);
            }
            _this.router.navTo(navigation.Constants.EventDetailFragment, {
                id: oEventId
            });
            _this.fragment.open();
        } catch (e) {
            jQuery.sap.log.warning("Couldn't find the right event")
        }
    }, this);
}

实际上您可以重用campaignSelectHandler只需更改签名实现,使其接受eventId

希望这有帮助