Adding row dynamically to sap.ui.table.Table (https://stackoverflow.com/a/48562620/5846045, https://stackoverflow.com/a/48597625/5846045)

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta charset="utf-8">

  <title>Demo</title>

  <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap"
    data-sap-ui-libs="sap.ui.core, sap.m, sap.ui.table"
    data-sap-ui-preload="async"
    data-sap-ui-theme="sap_belize"
    data-sap-ui-compatVersion="edge"
    data-sap-ui-resourceRoots='{"demo": "./"}'
    data-sap-ui-xx-componentPreload="off"
    data-sap-ui-xx-waitForTheme="true"
  ></script>

  <script>
    sap.ui.getCore().attachInit(function() {
      sap.ui.component({
        manifest: true,
        name: "demo" 
      }).then(function(createdComponent) {
        sap.ui.require([
          "sap/ui/core/ComponentContainer",
        ], function(ComponentContainer) {
          new ComponentContainer({
            component: createdComponent,
            height: "100%"
          }).placeAt("content");
        });
      });
    });
  </script>
</head>

<body class="sapUiBody sapUiSizeCompact" id="content">
</body>

</html>

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

  return UIComponent.extend("demo.Component", {
    metadata: {
      manifest: "json"
    },

    init: function() {
      UIComponent.prototype.init.apply(this, arguments);
      this.getRouter().initialize();
    },

  });
});

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

  return Controller.extend("demo.controller.Table", {
    onAddPress: function() {
      var model = this.getOwnerComponent().getModel();
      var currentRows = model.getProperty("/");
      var newRows = currentRows.concat(this.createEntry());
      model.setProperty("/", newRows);
    },

    createEntry: function() {
      return {
        foo: {
          selectedKey: "",
          items: [{
            key: "1",
            text: "Item 1-1",
          }, {
            key: "2",
            text: "Item 1-2",
          }, {
            key: "3",
            text: "Item 1-3",
          }],
        },
        bar: {
          selectedKey: "",
          items: [{
            key: "1",
            text: "Item 2-1",
          }, {
            key: "2",
            text: "Item 2-2",
          }, {
            key: "3",
            text: "Item 2-3",
          }]
        }
      };
    },

    getDataFromSelectedRows: function(table, path) {
      return table.getSelectedIndices().map(function(index) {
        return table.getContextByIndex(index).getProperty(path);
      });
    },

  });
});

[]

{
  "_version": "1.10.0",
  "start_url": "index.html",
  "sap.app": {
    "id": "demo",
    "type": "application",
    "title": "foo",
    "subtitle": "(Sub title)",
    "description": "bar",
    "applicationVersion": {
      "version": "1.0.0"
    },
    "dataSources": {
      "products": {
        "uri": "localData/products.json",
        "type": "JSON"
      }
    }
  },
  "sap.ui": {
    "technology": "UI5",
    "deviceTypes": {
      "desktop": true,
      "tablet": true,
      "phone": true
    },
    "supportedThemes": [
      "sap_belize_hcb",
      "sap_belize_hcw",
      "sap_belize_plus",
      "sap_belize"
    ]
  },
  "sap.ui5": {
    "dependencies": {
      "minUI5Version": "1.40.0",
      "libs": {
        "sap.ui.core": {},
        "sap.ui.table": {},
        "sap.m": {},
        "sap.ui.unified": {}
      }
    },
    "contentDensities": {
      "compact": true,
      "cozy": false
    },
    "models": {
      "": {
        "dataSource": "products"
      }
    },
    "rootView": {
      "viewName": "demo.view.App",
      "type": "XML",
      "async": true,
      "height": "100%",
      "displayBlock": true
    },
    "routing": {
      "routes": [{
        "pattern": "",
        "name": "home",
        "target": "home"
      }],
      "targets": {
        "home": {
          "viewName": "Table",
          "viewLevel": 1
        },
        "notFound": {
          "viewName": "Table",
          "transition": "show"
        }
      },
      "config": {
        "routerClass": "sap.m.routing.Router",
        "viewType": "XML",
        "async": true,
        "viewPath": "demo.view",
        "transition": "slide",
        "controlId": "myAppp",
        "controlAggregation": "pages",
        "bypassed": {
          "target": "notFound"
        }
      }
    }
  }
}

<mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" displayBlock="true">
  <App id="myAppp" class="sapUiSizeCompact" />
</mvc:View>

<mvc:View
	xmlns="sap.ui.table"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns:m="sap.m"
	xmlns:core="sap.ui.core"
  controllerName="demo.controller.Table"
>
	<m:Page
		showHeader="false"
		enableScrolling="true"
		class="sapUiResponsiveContentPadding"
	>
		<m:content>
			<Table id="myTable"
				class="sapUiSizeCondensed"
				rows="{/}"
				selectionMode="MultiToggle"
				visibleRowCount="{= ${/}.length}"
				selectionBehavior="Row"
			>
        <extension>
          <m:OverflowToolbar class="sapMTBHeader-CTX">
            <m:Title text="Products"/>
            <m:ToolbarSpacer />
            <m:Button
              icon="sap-icon://add"
              press=".onAddPress"
              type="Transparent"
            />
          </m:OverflowToolbar>
			  </extension>
				<columns>
					<Column>
						<m:Text text="Foo" />
						<template>
							<m:ComboBox width="100%"
                selectedKey="{foo/selectedKey}"
                items="{
                  path: 'foo/items',
                  templateShareable: false
                }"
						  >
                <core:Item
                  key="{key}"
                  text="{text}"
                />
						  </m:ComboBox>
						</template>
					</Column>
					<Column>
						<m:Text text="Bar" />
						<template>
							<m:ComboBox width="100%"
                selectedKey="{bar/selectedKey}"
                items="{
                  path: 'bar/items',
                  templateShareable: false
                }"
              >
                <core:Item
                  key="{key}"
                  text="{text}"
                />
							</m:ComboBox>
						</template>
					</Column>
				</columns>
			</Table>
		</m:content>
	</m:Page>
</mvc:View>