javascript - 如何在控件容器中找到SAPUI5控件并将其显示在顶部部分？

Question

在右侧，我想找到所需的行并将其显示在顶部部分，下面是我的代码:

var oSplitterV = new sap.ui.commons.Splitter();
oSplitterV.setSplitterOrientation(sap.ui.commons.Orientation.vertical);
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData("HelpData.json","",false);

//below is the code for left part
var oLinkTemplate = new sap.ui.commons.Link({
    text:"{name}",
    press: oController.doPress
});
var oPanel = new sap.ui.commons.Panel({text:"Title"});
var oLayout = new sap.ui.layout.VerticalLayout({
                    content:{
                        path:"/document",
                        template:oLinkTemplate
                    }
                });
oLayout.setModel(oModel);
oPanel.addContent(oLayout);
oSplitterV.addFirstPaneContent(oPanel);

//below is the code for right part
var oRowRepeater = new sap.ui.commons.RowRepeater({
                numberOfRows:1000
            });
oRowRepeater.setModel(oModel);
var oRowTemplate = new sap.ui.layout.VerticalLayout();
oRowTemplate.addContent(new sap.ui.commons.TextView({
                text:"{name}",          
            }));
oRowTemplate.addContent(new sap.ui.commons.FormattedTextView({
                htmlText:"{description}"
            }));
oRowRepeater.bindRows("/document", oRowTemplate);
oSplitterV.addSecondPaneContent(oRowRepeater);

另请参阅JSFiddle code这里。在 doPress 函数中，我可以获取我单击的链接的名称值，但我不知道如何获取相应的内容并将其显示在第二个 Pane 内容的顶部部分(它有点像 anchor )，请帮助我，谢谢你。

Answer 1

在 onPress 事件处理程序中，您可以查询底层绑定(bind)以确定选择了哪个元素。

一旦你有了这个，你就可以获得对 RowRepeater 中相应行的 jQuery 引用，并使用 jQuery 的滚动功能:

press: function(e) {
    var 
        // get the binding path so we can look
        // up the corresponding RowRepeater row
        sPath=e.oSource.getBindingContext().getPath(),

        // parse out the binding path number
        iPath=Number(sPath.match(/.*(\d)$/)[1]),

        // get the px value of the top of the
        // corresponding RowRepeater row using the binding path
        iScrollTop=oRowRepeater.getRows()[iPath].$().offset().top;

    // smoothly scroll to row
    $('html, body').animate({
        scrollTop: iScrollTop
    }, 1000);
}

这可能需要一些清理，但可以提供一个起点:

https://jsfiddle.net/bjfrqstb/