【问题标题】:WebSharper vs. AngularWebSharper 与 Angular
【发布时间】:2015-08-25 23:01:15
【问题描述】:

Angular 可以与 ui-router 一起定义状态以便在应用程序中移动。例如。当仍然在一个页面上时,您可以在页面左侧有列表视图,而在右侧有详细视图。然后,每当您从左侧列表更改记录时,详细信息也会更改,但是您仍然在同一页面中。 在 WebSharper 中是否也可以这样做,或者是否有任何其他选项可以处理这种情况?

此外,Angular 有模板(和指令)的概念。这使得能够将原生 html 代码包装到模板中,并将其用作其他一些 html 页面中的指令的一部分。例如,可以使用像 select2 这样的 JavaScript 库。这在 WebSharper 中是否也可能,例如使用 select2 库?

【问题讨论】:

    标签: angularjs f# web-frameworks websharper


    【解决方案1】:

    我对 Angular 不是很熟悉,但您列出的大多数功能都可以在 WebSharper 中作为扩展使用:WebSharper.UI.Next。您可以像描述的那样定义客户端路由。它也有模板,但它仍在进行中,所以还没有它的文档(但我们已经在我们的项目中积极使用它)。整个库旨在用于创建反应式单页应用程序,因此它可以作为 angular 的替代品(当然,不是那么广泛)。

    至于模板:由于您是在 F# 中编写代码,因此在 UI 中实现了一个方便的 DSL。Next 用于处理 HTML 组合子,因此您可以在 F# 中定义视图并在整个项目中重用它们,直到我们制作模板更平易近人。

    您可以使用外部库(如 select2),但它需要一些额外的工作,即定义库的类型(或至少是您想要使用的部分)。由于您正在编写 F# 代码,因此您需要知道事物的显式类型,因此您必须为处理这些类型的 JavaScript 库编写一个“绑定”。一方面它很棒,因为你现在有了类型,另一方面,对于大型项目来说,它可能会变得相当乏味。请查看WIG documentation,了解如何执行此操作的详细信息。

    【讨论】:

    • 我是否理解正确,WebSharper.UI.Next 是如何在 WebShaper 中完成双向绑定(在 UI 和底层模型之间,反之亦然),即 WebSharper 本身(除了 UI.Next)只包含单向绑定(从模型到 UI)?至于外部库,特别是 select2,选择 2 可以做什么的首选方法是什么?用户可以通过她/他的键盘输入过滤下拉值似乎是合理的。我想知道这是否还没有实现。
    • 没错,WebSharper 本身只为您提供了一种处理 DOM 的命令式方法,就像 JQuery 所做的那样。 WebSharper.UI.Next 为处理一般数据流提供了一个非常方便的抽象。它有点类似于 React js 作为 UI。Next 仅在需要时使用虚拟 DOM 渲染元素。我们没有像 select2 这样的选择框的实现,但您可以使用 UI.Next 实现类似的东西,或者在 WIG 中为 select2 编写绑定。我们已经在核心库中添加了 JQuery,所以应该不会太难。这里的主要问题是html的select无法设置样式。
    • 与 WebSharper 相比,您提到的样式问题是 UI.Next 特有的限制吗?顺便说一句,在 UI.Next 的 github 上,有一句话:“该库也将有可能成为 WebSharper 中构建 UI 的推荐方式”。我有点困惑。这是否意味着所有其他方式(sitelets、formlets、piglets 等)将来都会被弃用?
    • 问题来自于我们有内置帮助器来处理选择框,但它们使用select HTML 标签。如果您想要像select2 这样的样式,您将不得不使用 UI.Next 从头开始​​构建它,我想这将是相当长的一段时间。 Sitelet 在服务器端扮演不同的角色时将继续存在。 Pagelets 将被弃用,这意味着像Div [ Text "Hello" ] 这样的东西。 Formlets 和 Piglets 将被重写以使用 UI。Next 所以它们会发生一些变化,但它们不会去任何地方。
    • 有趣。谢谢你的解释。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多