2017-03-23 94 views
0

我有一個rootview問題。我想創建2個視圖(登錄表單和帶有導航列表的主頁)。SAPUI5根視圖

這是我家的觀點:

Home View

我希望當我點擊在左邊的菜單(根項目1,2,等),顯示內容形式(只是內容和仍然顯示菜單)。我成功時,根視圖設置爲主視圖,但在登錄視圖有菜單組件(導航列表)。我想在加載主視圖時將根視圖設置爲主頁,並且在加載登錄視圖時將根視圖設置爲其他(排除主視圖)。

Component.js:

sap.ui.define([ 
    "sap/ui/core/UIComponent" 
], function (UIComponent) { 
    "use strict"; 

    return UIComponent.extend("sap.ui.demo.Component", { 

     metadata: { 
      manifest: "json" 
     }, 

     createContent : function() { 
      // create root view 
      var oView = sap.ui.view({ 
       id : "mainContents", 
       viewName : "sap.ui.demo.template.App", 
       type : "XML", // <-- change this to JSON 
       viewData : { 
        component : this 
       } 
      }); 

      // done 
      return oView; 
     }, 

     init: function() { 
      // call the init function of the parent 
      UIComponent.prototype.init.apply(this, arguments); // calling parent UIComponents 

      // create the views based on the url/hash 
      this.getRouter().initialize();      // initializing router 
//   this.i18nModel();         // set i18n model 
     }, 

     i18nModel : function(){ 
      var i18nModel = new ResourceModel({ 
       bundleName: "sap.ui.demo.template.i18n.i18n" 
      }); 
      this.setModel(i18nModel, "i18n");    
     } 

    }); 

}); 

manifest.json的:

{ 
    "_version": "1.1.0", 
    "sap.app": { 
    "_version": "1.1.0", 
    "id": "sap.ui.demo.template", 
    "type": "application", 
    "i18n": "i18n/i18n.properties", 
    "title": "{{appTitle}}", 
    "description": "{{appDescription}}", 
    "applicationVersion": { 
     "version": "1.0.0" 
    } 
    }, 
    "sap.ui": { 
    "_version": "1.1.0", 
    "technology": "UI5", 
    "deviceTypes": { 
     "desktop": true, 
     "tablet": true, 
     "phone": true 
    }, 
    "supportedThemes": [ 
     "sap_hcb", 
     "sap_bluecrystal", 
     "sap_belize" 
    ] 
    }, 
    "sap.ui5": { 
    "_version": "1.1.0", 
    "rootView": 
     { 
      "viewName": "sap.ui.demo.template.Home", 
      "type": "XML", 
      "id": "app" 
     } 
    , 
    "dependencies" : { 
     "minUI5Version": "1.30", 
     "libs": { 
     "sap.ui.core": {}, 
     "sap.m": {}, 
     "sap.tnt": {}, 
     "sap.ui.layout": {} 
     } 
    }, 
    "models": { 
     "i18n": { 
     "type": "sap.ui.model.resource.ResourceModel", 
     "settings": { 
      "bundleName": "sap.ui.demo.template.i18n.i18n" 
     } 
     } 
    }, 
    "routing": { 
     "config": { 
     "routerClass": "sap.m.routing.Router", 
     "controlId": "mainContents", 
     "viewType": "XML", 
     "controlAggregation": "pages", 
     "viewPath": "sap.ui.demo.template", 
     "async": true 
     }, 
     "routes": [ 
     { 
      "pattern": "", 
      "name": "first", 
      "target": "first" 
     }, 
     { 
      "pattern": "home", 
      "name": "home", 
      "target": "second" 
     }, 
     { 
      "pattern": "page1", 
      "name": "page1", 
      "target": "page1" 
     }, 
     { 
      "pattern": "login", 
      "name": "login", 
      "target": "login" 
     }, 
     { 
      "pattern": "mainContents", 
      "name": "mainContents", 
      "target": "mainContents" 
     } 
     ], 
     "targets": { 
     "first": { 
      "viewName": "Index" 
     }, 
     "second": { 
      "viewName": "Home" 
     }, 
     "page1": { 
      "viewName": "Page1" 
     }, 
     "login": { 
      "viewName": "Index" 
     }, 
     "mainContents": { 
      "viewName": "Home" 
     } 
     } 
    } 
    } 
} 

我如果設置根查看首頁:

Login false

我想這一點:

login true

當我將rootview設置爲App時,登錄true但主視圖爲false。

App查看:

<mvc:View 
    xmlns="sap.m" 
    xmlns:mvc="sap.ui.core.mvc" 
    displayBlock="false"> 

    <App id="mainContents" class="blueBackground"> 
    </App> 

</mvc:View> 

如何解決有關rootview這個問題?

感謝。鮑比。

回答

0

將rootview設置爲一個視圖,使用router.navTo()函數處理控制器中的其餘視圖遍歷,並在其中指定模式。 只需在導航到另一個視圖時進行清理,就可以銷燬創建的菜單。並在遍歷相關視圖時再次創建它