XML视图嵌入子视图

时间:2014-12-10 14:51:25

标签: sapui5

我正在尝试构建一个包含多个视图的应用。第一个视图显示一个列表和一个“创建”按钮。单击“创建”按钮后,将显示第二个视图。

我希望能够将子视图嵌入到第二个视图中,但是我收到了一个错误。

<mvc:View
  controllerName="openui5.view.Framework"
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  xmlns:mvc="sap.ui.core.mvc"
>
  <Page id="page"
    title="{i18n>DetailTitle}"
    showNavButton="true"
    navButtonPress=".onBack"
  >
    <Button id="saveButton"
      text="Save"
      type="Accept"
      icon="sap-icon://save"
      press=".onSave"
    />
    <Button id="nextButton"
      text="Next"
      type="Accept"
      icon="sap-icon://action"
      press=".onNext"
    />
    <mvc:XMLView viewName="openui5.view.BasicInformation"/>
  </Page>
</mvc:View>

<mvc:XMLView viewName="openui5.view.BasicInformation"/>行指向另一个定义如下的视图:

<mvc:View
  controllerName="openui5.view.BasicInformation"
  xmlns="sap.m"
  xmlns:mvc="sap.ui.core.mvc"
>
  <Page id="page1"
    title="{i18n>NewPR}"
  >
    <Button id="stuffButton"
      text="Stuff"
      type="Accept"
      icon="sap-icon://save"
      press=".onSave"
    />
  </Page>
</mvc:View>

当我运行该应用时,我收到错误消息

  

TypeError:frag未定义。

我可以看到子视图的标题,但没有按钮。我推测是因为上述错误。

在尝试嵌入此子视图时,我是不是在做“特殊”的事情?

2 个答案:

答案 0 :(得分:0)

我们也使用了子视图的片段,它工作正常,但我发现它有点麻烦,把它放在一个jsfiddle ..还试过,见下文。您不需要在片段周围添加视图标记。您的片段在项目中应该具有名称xx.fragment.xml,并且不需要控制器。 那么你应该能够像xml一样在xml视图中直接包含它
另见https://openui5.hana.ondemand.com/#docs/guide/2c677b574ea2486a8d5f5414d15e21c5.html

答案 1 :(得分:0)

如前所述,您可以使用对内容“小部分”有用的片段。 其他解决方案是在外壳程序中包含一个带有View内部页面的Shell组件,然后使用路由机制,以便将“子视图”的内容加载到此Shell页面中:

在主视图上:

<Shell id="shellContainer" appWidthLimited="false">
    <App id="appContainer" backgroundOpacity="0"></App>
</Shell>

在manifest.json上:

"targets": {...
"YourSubViewDestination": {
                "viewType": "XML",
                "viewName": "YourSubViewName",
                "controlAggregation": "pages",
                "controlId": "appContainer",
                "parent": "YourMainViewDestination"
            }

...}

关于“创建”按钮的操作:

this.getOwnerComponent().getRouter().navTo("YourSubViewDestination", {});

您可能需要一些有关路由的帮助:Routing navigation