These are chat archives for ThoughtWorksInc/Binding.scala

12th
May 2016
杨博 (Yang Bo)
@Atry
May 12 2016 00:08
val thing = Var[Option[String]](noneThing)
Justin Maat
@jxm262
May 12 2016 00:09
yup i was able to find it in one of your examples (had to dig a bit , but you have it in some code)
One other question I had though…
I know its possible to do something like the following -
val a = Var(“a”)
…
<div>
   { if (a.each == “a”) {
        <div>someVal</div>
      } else {
         <div>otherVal</div>
     }
  }
</div>
and then if somewhere later in the code , you assign a := “b”, the otherVal is rendered
but is it possible to have it Not return another dom element? As in , skip the else statement altogether?
so..
val a = Var(“a”)
…
<div>
   { if (a.each == “a”) {
        <div>someVal</div>
      }
  }
</div>
I know I can wrap it in an Option and perform a yield on it, but thought it made more sense to have a way to dynamically render some dom element if some condition was met, and if not then don’t do anything
杨博 (Yang Bo)
@Atry
May 12 2016 00:14
then don’t do anything
Even generating nothing is doing domething
Justin Maat
@jxm262
May 12 2016 00:23
hmmm...
so maybe this is a gap in my knowledge of FP, but can you maybe explain the best way to do the below logic (psuedocode)
   if (condition) 
       render dom element
   else 
        don’t render dom element
I’m coming from JavaScript/React world, so I may not be understanding something simple
杨博 (Yang Bo)
@Atry
May 12 2016 00:28
<div>
  {
    if (a.each == “a”) {
      Constants(<div>someVal</div>)
    } else {
      Constants.empty
    }
  }
</div>
Justin Maat
@jxm262
May 12 2016 00:28
ah ha!
Constants.empty
I overlooked this. Thanks so much!!
杨博 (Yang Bo)
@Atry
May 12 2016 00:29
I think you can't do this in JavaScript/React world
Because if/else statement does not have a value in JavaScript
Justin Maat
@jxm262
May 12 2016 00:31
well with react I do this quite often, but return null
render() {
    <div>
         { (condition) 
                 ? <div></div> 
                 : null
         }
    </div>
}
杨博 (Yang Bo)
@Atry
May 12 2016 00:32
In Scala, the above code equals to
<div>
  {
    val v: Constants[Div] = if (a.each == “a”) {
      Constants(<div>someVal</div>)
    } else {
      Constants.empty
    }

    v
  }
</div>
Justin Maat
@jxm262
May 12 2016 00:32
yup got it.
the Constants.empty is what I was missing
cool cool , thanks!
杨博 (Yang Bo)
@Atry
May 12 2016 00:35
Another option:
<div>
  {
    if (a.each == “a”) {
      <div>someVal</div>
    } else {
      <!-- no someVal -->
    }
  }
</div>
Justin Maat
@jxm262
May 12 2016 00:35
hmm.. you mean with code comment ?
i think i’d rather not include it in the markup at all though.
杨博 (Yang Bo)
@Atry
May 12 2016 00:36
Not "code comment", it's HTML comment.
Justin Maat
@jxm262
May 12 2016 00:36
yeah that’s what i mean, sorry
杨博 (Yang Bo)
@Atry
May 12 2016 00:36
Note that you have to upgrade your Binding.scala to 5.4.0, because HTML comment is a newly added feature
Justin Maat
@jxm262
May 12 2016 00:37
ok cool, yeah i’ll upgrade soon. I think there were a couple other things different in the new version I saw as well