步骤15:嵌套视图

当我们的页面内容变得越来越复杂,需要将页面内容移动到单独的视图了。通过这种方法,应用程序结构更容易理解,并且方便程序的重用。

1.练习效果

步骤15:嵌套视图 - 第1张  | 优通SAP

现在将面板内容重构为一个单独的视图(上一步没有视觉变化)

2.源码

您可以在演练-步骤15中查看和下载所有文件。

webapp/view/App.view.xml

这里不是将页面及其内容直接放入我们的 App view 视图,我们将其移至新的单独位置 Hellopanel视图中。我们使用 XMLView 标签在页面的内容中聚合显示。

webapp/view/HelloPanel.view.xml(新)

这里我们把面板的全部内容现在已添加到新文件中 HelloPanel.view.xml中。我们还通过设置controllerName XML视图的属性。

webapp/controller/HelloPanel.controller.js (New)

现在,我们将所有内容移出了应用程序视图和控制器。该应用控制器暂时仍为空,我们稍后将使用它来添加更多功能。