Skip to Content
Author's profile photo Former Member

Creating Component from another Component of different Applications

Dear All,

I was just wondering that SAPUI5 uses Component based methodology, then how come we can use concept of reusability.

Let me show you how we can call a component’s method, in another component.

Firstly, let’s create a SAPUI5 project without ‘initial View’

Screen Shot 2016-01-29 at 19.34.09.png

Create a Component.js file in webcontent ‘folder’, write code as:-

// declaring Component Module"test.Component");
// extending UI Component
 // defining a public method myButton which returns a Button with the text 'Login'
   myButton : function(){
    return new sap.m.Button({text:"login"});

code of index page as :

<script>"test", "./");
  new sap.ui.core.ComponentContainer({
  name : "test"

deploy it to “SAP ABAP Repository” referring to

Now, let’s create another Component (calling component )as same as above:-


<script>"test3", "./");
  new sap.ui.core.ComponentContainer({
  name : "test3"

in Component.js"test3.Component");
  createContent : function(){
// creating Component instance of above defined Component
  var ocomp1 = sap.ui.getCore().createComponent({
// test is a declaration name of the calling component
  name : "test",
//note: z_comp1 is the bsp application name
url : "/sap/bc/ui5_ui5/sap/z_comp1"
    oButton = ocomp1.myButton();
  return oButton;

Deploy it to same ABAP repository… and run the application as ‘Run on ABAP Server’.

This is how we can use a modularization in SAPUI5, team of developer can divide their work, and can integrate application.

Thank you.

Assigned Tags

      Be the first to leave a comment
      You must be Logged on to comment or reply to a post.