Home > Web Front-end > HTML Tutorial > javaTemplates-Study Notes 4_html/css_WEB-ITnose

javaTemplates-Study Notes 4_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:55:16
Original
1200 people have browsed it

Understanding the calling sequence of the application

This place is very weak, the browser http://localhost:9000/index.html -> conf/routes -> app/controllers /Application.scala -> def index = Action -> {Ok(views.html.index("Hello World!"))} -> Return the content of the main text in plain text or HTML format.

This should be understood in this way, most languages ​​​​have similar structures. (It seems like this)

Understanding the view layer

After researching it myself, I found index.scala in the default file. html is the content display page and main.scala.html is layouts. If you don’t understand, check the information

The play template is directly based on the Scala language based on HTML. The template file is usually placed in the view directory, and the file ends with ". scala.html" double extension. Each template file is a Scala code, which needs to be checked for type and syntax by the Scala compiler and compiled into a .class executable JVM binary file.

Play when compiling Prime will automatically generate the Play template file of .scala.html into the source code file of .scala. For example, the template file of /app/views/index.scala.html will be generated as /target/scala-2.9.1/src_managed/main /views/html/index.template.scala file, which will then be compiled into index.class by the Scala compiler.

Parse the index.scala.html file:

@(message: String)@*模板入参,类型为String类型,命名为message*@@*调用main.scala.html模板,传入参数message*@@main("Welcome to Play") {    @*这里调用了play中自带的一个欢迎模板插入message*@    @play20.welcome(message)}
Copy after login

In the play template, the @ symbol represents that the following code is a Scala code block, because the .scala.html file It will eventually be compiled into Scala. The code block in index.scala.html treats the template file as an object, and the incoming parameters have declared types. You have to take a look at the Java data types.

The comment code here Explain the writing method:

@*我是注释*@
Copy after login

Since the Scala code starts with @, then @**@ is a comment that is easy to remember.

Combined with the above index .scala.html Look at the Action in Application.scala

  def index = Action {    Ok(views.html.index("Hello World!"))  }
Copy after login

index receives one parameter. Try receiving multiple parameters index.scala Application.scala main.scala .html How to write between the three:

First define the second parameter in Application.scala

  def index = Action {    Ok(views.html.index("Your new application is ready.","我在哪里"))  }
Copy after login

Then define the parameter in index.scala.html

@(message: String,exmple: String)@*这里声明的格式与Application中的格式一致*@@*此处main中接收的格式也是2个*@@main(message,exmple) {    @*方法体里面(也不知道这里该用什么专业的名称,暂且叫方法体.)就是HTML页面中显示的内容*@    <p>学习笔记</p>    <a href="">凡事不可以</a>}
Copy after login

Then see how to call

@(title: String,exmple: String)(content: Html)<!DOCTYPE html><html>    <head>        <title>@title</title>        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")">        <link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.png")">        <script src="@routes.Assets.at("javascripts/hello.js")" type="text/javascript"></script>    </head>    <body>        @exmple        @content    </body></html>
Copy after login

The parameters in the header are correctly defined and the parameters can be called in main.scala.html It is displayed at will. Among them, @content is the HTML code in the @main(){...} method body in the index.scala.html file.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template