-
Notifications
You must be signed in to change notification settings - Fork 108
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Customize tags with inner html #42
Comments
Is the syntax difference between custom tags and custom functions important for you? If it is not important for you, you can simply create a popconfirm(title="Are you sure delete this task?",
onConfirm=confirm,
onCancel=cancel,
okText="Yes",
cancelText="No") {
<a href=" ">Delete</a >
} |
I have to admit that the syntax is important for me. I'm not sure for other people whether it is important or not? In my opinion, syntax is one reason why Binding.scala is more charming than other alternatives. For example, in ScalaTags and HTML literal which one you will choose to use? Syntax matters a lot. In this particular example, using the As for me, I'm developing a library(https://github.com/sadhen/Binding-SemanticUI) based on Binding.scala and SemanticUI to provide easy-to-use custom tags like Ant Design(http://ant.design), so that programmers already familiar with Ant Design would be happy to use Binding.scala. |
I found a more acceptable work around: <div>
<Popconfirm title="Are you sure delete this task?"
onConfirm={confirm}
onCancel={cancel}
okText="Yes"
cancelText="No"
inner={
<a href="#">Delete</a>
}/>
</div> Comparing with <div> {
popconfirm(title="Are you sure delete this task?",
onConfirm=confirm,
onCancel=cancel,
okText="Yes",
cancelText="No") {
<a href="#">Delete</a >
}
} </div> , which one do you prefer ? I prefer the former one. However, using the latter one, we would have more IDE support. |
+1, that would be awesome |
This would be great for consuming web components, such as the ones defined by Polymer. |
Please, show the body (with return type) of popconfirm |
import com.thoughtworks.binding.dom
import org.scalajs.dom.raw._
import org.scalajs.dom.document
@dom def popconfirm(
title: String,
okText: String, cancelText: String,
onConfirm: Event => Unit, onCancel: Event => Unit
)(
// For FXML, use `Binding[Node]` instead of `Node`
message: Node
) = {
<section>
<h3>{ title }</h3>
<div>
{ message }
</div>
<button type="button" onclick={onConfirm}>{
okText
}</button>
<button type="button" onclick={onCancel}>{
cancelText
}</button>
</section>
}
@dom
def render = popconfirm(title="Are you sure delete this task?",
onConfirm={ _ =>
println("confirm")
},
onCancel={ _ =>
println("cancel")
},
okText="Yes",
cancelText="No") {
<a href=" ">Delete</a >
}.bind // .bind should be avoided for FXML
dom.render(document.body, render) |
Thanks a lot! |
But if I'd like to get instead of |
Just use ` BindingSeq[Node]` , since you can easily convert other types to
it.
Serg <notifications@github.com> 于2018年10月19日周五 下午2:35写道:
… But if I'd like to get instead of message: Node different types,
Binding[Node], BindingSeq[Node], BindingSeq[Option[Node]]? Can you
propose anything? Is there any common type?
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<#42 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AAktur3TIBe5wCcl2B57NZzW81ozDl5eks5umXK5gaJpZM4LqXCp>
.
--
杨博 (Yang Bo)
|
Thanks, my thought were around |
I'm trying to implement the inner html feature in https://github.com/sadhen/Binding-SemanticUI |
For example, https://ant.design/components/popconfirm/
What I expect:
here
render
is the function used in macros.But this test case(https://github.com/ThoughtWorksInc/Binding.scala/blob/11.0.x/fxml/.js/src/test/scala/com/thoughtworks/binding/DateSpec.scala) shows that
<Date></Date>
isBinding[Date]
or another type relating toDate
. It seems@fxml
is not suitable for customizing tags to create something like Ant Design.In #4 (comment) ,
there are tricks to make custom tags work, but it is without any inner html (eg.
<a href="#">Delete</a>
).The text was updated successfully, but these errors were encountered: