[英]UI5: How to access html element defined inside view?
I have a UIComponent with this view:我有一个带有此视图的 UIComponent:
<mvc:View controllerName="my.components.webmap.controller.Map"
xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m"
xmlns:html="http://www.w3.org/1999/xhtml">
<html:div id='myDiv' style='height:inherit'></html:div>
<Button id="helloWorld" text="Say Hello" press=".onShowHello" />
</mvc:View>
In the View controller, I can get the Button and its id from在视图控制器中,我可以从
this.getView().byId("helloWorld").sId
but I can't get the ID of the div using the byId()
method.但我无法使用
byId()
方法获取 div 的 ID。
this.getView().byId("myDiv"); // returns undefined
How can I get the ID of the div in order to access the element?如何获取 div 的 ID 以访问该元素? I need the ID of the div so I can append some additional 3rd party controls to it.
我需要 div 的 ID,所以我可以向它附加一些额外的 3rd 方控件。
There are some possible solutions.有一些可能的解决方案。 Let's see the preferred one from UI5 point of view.
让我们从 UI5 的角度来看首选。 Your view:
您的观点:
<mvc:View controllerName="yourcontroller" xmlns="sap.m" xmlns:layout="sap.ui.layout" xmlns:mvc="sap.ui.core.mvc" xmlns:html="http://www.w3.org/1999/xhtml"> <Button press="btn" /> <layout:VerticalLayout id="layout"> </layout:VerticalLayout> </mvc:View>
You can any use any layout, which fits your requirements, and of course you can set layout properties as well.您可以使用任何符合您要求的布局,当然您也可以设置布局属性。 In your controller, the event handler of the button:
在您的控制器中,按钮的事件处理程序:
btn: function(oEvent) { var oLayout = this.getView().byId("layout"); oLayout.addContent(new sap.m.Text({text: "test"})); }
-o- -o-
If your api supports only a div container, you should use some jQuery tricks:如果你的 api 只支持一个 div 容器,你应该使用一些 jQuery 技巧:
var oDiv = $('[id*="myDiv"]');
However, with this solution you will lose the UI5 specific control handling.但是,使用此解决方案,您将失去 UI5 特定的控件处理。
To answer your question how to get the ID of the HTML element (div) - you can also assemble the ID in your controller like this:要回答如何获取 HTML 元素 (div) 的 ID 的问题 - 您还可以像这样在控制器中组装 ID:
var sHTMLElementID = this.getView().sId.concat("--".concat("viewDiv"));
So UI5 still handles the view's id and prefixes.所以 UI5 仍然处理视图的 id 和前缀。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.