微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

数据绑定 – 骨干:模型到模板和模板到模型绑定

我正在将Backbone和Backbone.Marionette整合到现有的Web应用程序项目中.我们计划将现有功能全部留在项目中,但是任何新的功能,我们将利用Backbone结构和木偶主题.业务的第一个顺序是决定 HTML模板渲染库以及这些模板的数据绑定解决方案.以前,我们一直在使用 JsRenderJsViews的所有模板需求和数据绑定,但我们愿意为我们的新功能探索新的途径.所以基本上我一直在研究各种解决方案,现在需要一些建议或想法来选择什么.这是我到目前为止看到的:

07002:

Pros: Seems to follow Backbone’s idea of separation on concerns which helps keep your templates very “clean”.

Cons: Looks like you have to write a bit more code in your views to define bindings. Also,seems to lack the ability to do conditional rendering so you have to always render the full template and just toggle the display of certain elements.


Rivets.js

Pros: Handles a bit more data binding options within the template without making it too messy.

Cons: Also,seems to lack conditional rendering.


Knockback/Knockout

Pros: Handles all kinds of data binding needs through attributes.

Cons: Easy to start “dirtying” the template with converters. Have to add another step to create Knockout view-models from Backbone models.


JsViews

Pros: Similar to Knockout’s abilities but with different Syntax. Handles conditional rendering.

Cons: In the past we dirtied our templates by adding too much business logic within the template but that may be an issue with our development that we can correct. Need to create functionality to tie JsViews observability functionality to Backbone model events. Other libraries like StickIt and Knockback automatically handle this.

我们还研究了Backbone.ModelBinder,这是StickIt和Rivets之间的某个地方.

任何人都可以分享他们做出的任何决定,以及为什么他们选择一个插件/图书馆?我也欢迎其他建议.谢谢.

解决方法

我用过这些

Mustache.js

Pro的:不仅胡子支持变量绑定,而且还可以处理函数绑定.例如你可以拥有

<a href="{{test}}" >click me </a>

然后在你看来有一个叫做test的方法.这节省了大量的rendundant分配类/ id链接,并在View类中绑定事件.

Con的:我不喜欢它的语法.

接下来,我在Ruby on Rails中使用了coffeescript,它在jst eco模板系统中有一个构建.一个亲,你有分开的文件模板.在pageload中,它们绑定到dom中的全局变量.这些被缩小,并且比一些伪脚本模板标签更好.另一个亲,你写如果else和for循环像你这样在ruby.不利的是,他们使用剃刀标签,并且不允许容易地与服务器端代码(如翻译)混合.

其他图书馆则是强调模板引擎.很简单,但相当强大.预测,您已经可以使用(骨干网需要下划线).缺点是,您无法(认情况下)从外部文件加载模板.我已经通过使用serverside代码(require_once,render partial)来解决这个问题.如果您使用require.js,连同文本插件(http://requirejs.org/docs/download.html#text),您可以加载模板作为依赖.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


什么是深拷贝与浅拷贝?深拷贝与浅拷贝是js中处理对象或数据复制操作的两种方式。‌在聊深浅拷贝之前咱得了解一下js中的两种数据类型:
前言 今天复习了一些前端算法题,写到一两道比较有意思的题:重建二叉树、反向输出链表每个节点 题目 重建二叉树: 输入某二叉树的前序遍历和中序遍历的结果,请重建出该二叉树。假设输入的前序遍历和中序遍历的结果中都不含重复的数字。例如输入前序遍历序列 {1,2,4,7,3,5,6,8} 和中序遍历序列 {
最近在看回JavaScript的面试题,this 指向问题是入坑前端必须了解的知识点,现在迎来了ES6+的时代,因为箭头函数的出现,所以感觉有必要对 this 问题梳理一下,所以刚好总结一下JavaScript中this指向的问题。
js如何实现弹出form提交表单?(图文+视频)
js怎么获取复选框选中的值
js如何实现倒计时跳转页面
如何用js控制图片放大缩小
JS怎么获取当前时间戳
JS如何判断对象是否为数组
JS怎么获取图片当前宽高