Step 1: No Data Binding

opensapkr·2019년 7월 2일

databinding ui5

ui5-Data Binding

목록 보기

2/14

Preview

Coding

Data Binding - Step 1.

webapp/index.html (New)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Data Binding Tutorial</title>
	<script id="sap-ui-bootstrap"
		src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
		data-sap-ui-theme="sap_belize"
		data-sap-ui-libs="sap.m"
		data-sap-ui-compatVersion="edge"
		data-sap-ui-async="true">
	</script>
	<script src="index.js"></script>
</head>
<body class="sapUiBody" id="content"></body>
</html>

ui5_data_biding/01/webapp 폴더 내에 index.html 파일을 생성한다.

webapp/index.js (New)

sap.ui.require([
	"sap/m/Text"
], function (Text) {
	"use strict";

	// Attach an anonymous function to the SAPUI5 'init' event
	sap.ui.getCore().attachInit(function () {
		// Create a text UI element that displays a hardcoded text string
		new Text({text: "Hi, my name is Harry Hawk"}).placeAt("content");
	});
});

ui5_data_biding/01/webapp 폴더 내에 index.js 파일을 생성한다.

해당 파일은 sap.m의 Text 컨트롤을 html에 컨텐트에 삽입하는 하드 코딩이다.
아직 모델 object에 데이터와 바인딩이 되지 않았다.

opensapkr

UI5/Fiori/BTP 도큐먼트 번역 및 관련 정보 공유합니다.

이전 포스트

Step 0: DataBinding

다음 포스트