2014-03-30 86 views
1

因此,基本上我在SAPUI5中有一個拆分頁面,並且只有很少的母版頁和詳細頁面連接到它。我沒有問題在一個JavaScript文件中完成整個事情,但由於文件變得太大而且太難以閱讀,我想將MVC設計應用於此應用程序並將每個頁面分隔成一個視圖和控制文件。這是我的例子:將MVC應用到SAPUI5應用程序

var oSplitApp = new sap.m.SplitApp({ 

    masterPages : [ page1, page4, page5], 
    detailPages : [ page0, page2, page3 ], 
    initialMaster : "page1", 
    initialDetail : "page0" 
}); 

和頁面,如:

var page0 = new sap.m.Page("initialPage", {}); 
var page1 = new sap.m.Page({ 
    enableScrolling : true, 
    footer : new sap.m.Bar({ 
     id : 'page1_footer', 
     contentMiddle : [ new sap.m.Button({ 
      text: "Add" 
     })] 
    }), 
    content : [ oTable = new sap.m.Table("items", { 
     inset : true, 
     visible : true, 
     getIncludeItemInSelection : true, 
     showNoData : false, 
     columns : [ new sap.m.Column({ 
      styleClass : "name", 
      hAlign : "Left", 
      header : new sap.m.Label({ 
       text : "something" 
      }) 
     }) ] 
    }) ] 
}); 
var template = new sap.m.ColumnListItem({ 
    type : "Navigation", 
    visible : true, 
    selected : true, 
    cells : [ new sap.m.Label({ 
     text : "{name}" 
    }) ] 
}); 

等等... 也是每個頁面都有其對attachPress功能,所以當你點擊按鈕或鏈接的東西發生和其他一些頁面啓動。請詳細告訴我如何做到這一點?

感謝您提前給予的幫助。

+0

只是爲了讓你知道。我正在使用JS視圖和控制器。 – Ryan

回答

2

您可以通過爲每個主/細節創建自己的視圖/控制器來完成此操作。在你看來,你的oSplitApp建成,那麼你可以實例化你的主/詳細信息視圖這樣的:例如

// load your external view/controller: 
var page1 = sap.ui.jsview("path-to.DetailView1"); 

var oSplitApp = new sap.m.SplitApp({ 
    masterPages : [ page1, page4, page5], 
    detailPages : [ page1, page2, page3 ], 
    initialMaster : "page1", 
    initialDetail : "page0" 
}); 

您的外部查看文件可能在createContent返回sap.m.Page對象。

希望這可以幫助你。如果您對此有更多疑問,請告訴我。