SAPUI5/OPENUI5 - 使用对话框路由答案

【问题标题】：SAPUI5/OPENUI5 - Routing with DialogsSAPUI5/OPENUI5 - 使用对话框路由
【发布时间】：2015-06-12 00:47:12
【问题描述】：

我目前被路由和对话框的组合所困扰。我有一个包含列表元素的视图，当我单击列表中的一个元素时，我希望详细视图显示在对话框（弹出窗口）中。问题是，我还想要我的 url 中列表元素的 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>

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

除此之外，我从启动路由器的 AbstractController 扩展了“ui.views.pages.EventDetail”视图。它适用于我的正常视图，但是当我打开对话框时，我失去了对它的引用并且无法返回到我的初始视图。

我知道这个解决方案行不通，所以我希望您对如何让它发挥作用有一些建议！

提前致谢！

顺便说一句：这是 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
                    }
                ]
            }

【问题讨论】：

标签： routing dialog sapui5

【解决方案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

希望对你有帮助

【讨论】：