[0614]Java Web開発プロセス🌞

12233 ワード
Thymeleaf テキストリンク

この間学んだこと



JSPの代わりにThymeleafを使用する
  • ビューセグメント
    • を開始する.

    Thymeleaf


    htmlタグにプロパティをテンプレートエンジン、th:xx形式で追加し、値や処理などのコンテンツをページに埋め込むことができます.
  • HTMLコードに影響を与えずにデータを挿入できます.

    • 設定



    確認

  • templates/index.html 
    • <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	타임리프 인덱스 페이지입니다.
</body>
</html>
  • HomeController 
    • @Controller
public class HomeController {

	@RequestMapping("/index")
	public String index() {
		
		return "index"; // 타임리프 설정했으므로 index.html을 찾을 것임
	}
}

    結果画面



    Message Expression - #{...}


  • 書き込み#外部ファイルからデータが抽出されます


  • 外部ファイルの場所


  • message.properties
    • title=메시지입니다.
  • application.properties 
    • spring.messages.basename=messages/message // resources 아래에 설정한 폴더명/파일명 적어주기
spring.messages.encoding=UTF-8
  • index.html 
    • <h1 th:utext="#{title}">타임리프 인덱스 페이지입니다.</h1>

    Variables


    複文

  • list.html 
    • <tbody>
	<tr th:each="n:${list}"> <!-- list 하나하나를 n이라는 이름으로 쓰겠다 -->
		<td >8</td>
		<td class="title indent text-align-left">
			<a href="detail.html" th:text="${n.title}">스프링 8강까지의 예제 코드</a></td>
		<td th:text="${n.writerId}">newlec</td>
		<td th:text="${n.regDate}">
			2019-08-18
		</td>
		<td th:text="${n.hit}">146</td>
		<td><input type="checkbox" name="open"></td>
		<td><input type="checkbox" name="del"></td>
	</tr>
</tbody>

    結果画面



    #calendars

  • list.html 
    • <td th:text="${#calendars.format(n.regDate,'yyyy.MM.dd')}">
	2019-08-18
</td>

    🐥 の最後の部分


    今日は時間帯を勉強する時間があります.
    タイムラインは、HTMLコードを変換することなく、データを動的に表示できるテンプレートエンジンです(JSPとは異なります).既存のHTMLコードに時間軸の文法を適用してみましたが、スピードも速く、文法も難しくなく、いいと思います.
    今は2つ目のプロジェクトに取り組んでいます.
    私のチームはモバイルWebアプリケーションで独立書店の関連サービスを展示するつもりで、私はその中の評論システムを担当して、コントローラ、サービスとデータを実現します.最初の項目では、単にCRUDを実施しただけであれば、本項目では、CRUDだけでなく、画面に地図を表示するために、地図apiも使用する.以前散歩関連ソフトを作っていた時に一度使ったことがあるので、今回は気軽に実現できるはずです.今は塾もあと1ヶ月しか残っていないので、ラストスパートを頑張りましょう!

    コメントサイト


    Thymmeleaf公式サイト
    タイムスライスとは?
    20177301005-範白金真実験一ソフトウェアエンジニアリング準備-ソフトウェアエンジニアリングの基本操作を学び、考える
    コードチャレンジ10 210709