Как разбить html-контент на части с помощью Binding.scala?

Я хочу разделить свой html-контент на разные части, чтобы их можно было легко комбинировать на разных страницах. Я пытался кодировать так:

  object App extends JSApp {
    @dom def title2() = {
      <!-- Title 2 -->
        <h2>Title 2</h2>
      <!-- End Title 2 -->
    }

    @dom def render() = {
        <h1>Title 1</h1>
        { title2.bind }
        <h3>Title 3</h3>
    }

    @JSExport def main(): Unit = {
      dom.render(document.getElementById("app"), render)
    }
  }

затем получите ошибку компиляции, говоря:

App.scala:23: org.scalajs.dom.html.Heading does not take parameters
[error]             { title2.bind }
[error]             ^
[error] one error found
[error] (compile:compileIncremental) Compilation failed

затем я добавляю одну пустую строку между title1 и title2

    @dom def render() = {
        <h1>Title 1</h1>

        { title2.bind }
        <h3>Title 3</h3>
    }

Успешная компиляция с одним предупреждением:

App.scala:24: a pure expression does nothing in statement position; multiline expressions might require enclosing parentheses
[warn]             { title2.bind }
[warn]                      ^
[warn] one warning found

Когда я открываю файл html, я обнаруживаю, что title1 и title2 отсутствуют, на странице есть только title3.

Я новичок в scala и Binding.scala и не знаю, почему это происходит.

Вы можете попробовать протестировать на ScalaFiddle.


person hailong    schedule 15.03.2017    source источник


Ответы (1)


Это ваш код:

<h1>Title 1</h1>
{ title2.bind }
<h3>Title 3</h3>

Компиляция Scala проанализировала приведенный выше код так же, как:

<h1>Title 1</h1>{ title2.bind };
<h3>Title 3</h3>;

Как видите, компилятор Scala пытается обработать <h1>Title 1</h1> как функцию, а затем вызвать ее с аргументом title2.bind.

Однако <h1>Title 1</h1>, тип которого org.scalajs.dom.html.Heading, не может быть вызван.

org.scalajs.dom.html.Heading does not take parameters

Вот почему вы видите сообщение об ошибке.

Вы можете избежать ошибки, обернув их все литералом XML.

<div>
  <h1>Title 1</h1>
  { title2.bind }
  <h3>Title 3</h3>
</div>
person Yang Bo    schedule 15.03.2017