使用 Rivets.js 迭代 Backbone.js 模型的集合?

2024-04-26

我在用着铆钉.js http://rivetsjs.com/对于 Backbone 项目中的两个双向数据绑定,并且希望实现迭代绑定。文档表明迭代绑定是可能的,但没有可用的示例。我正在使用一个简单的 Rails API 将 JSON 发送到客户端,并希望迭代内容。有没有人成功地让这个功能在 Rivets.js 中工作?

参考资料:使用 Backbone.js 和 Rivets.js 的简单示例 https://stackoverflow.com/questions/11719914/simple-example-using-backbone-js-and-rivets-js

jsFiddle在这里:http://jsfiddle.net/rhodee/3qcYQ/1/ http://jsfiddle.net/rhodee/3qcYQ/1/

来自 Rivets.js 网站

迭代绑定

尽管 Rivets.js 中可能会包含每个项目的绑定例程,但您 可以使用 data-html 绑定以及一组格式化程序来完成 集合的排序和迭代渲染(以及其他很酷的事情)。

<ul data-html="model.tags | sort | tagList"></ul>

扩展这个答案:

从 0.3.2 开始,现在有一个 data-each-[item] 绑定正是用于此目的。

请注意,您需要专门修改您的铆钉adapter使用 Backbone Collection,因为 Rivets.js 网站上的开箱即用示例不适用于此用例。

你需要在你的rivets.configure({ adapter: ... }):

...
read: function( obj, keypath ) {
    return obj instanceof Backbone.Collection 
       ? obj["models"] 
       : obj.get(keypath)
}

还有 JS 小提琴:http://jsfiddle.net/tigertim719/fwhuf/70/ http://jsfiddle.net/tigertim719/fwhuf/70/

为了获得奖励积分,嵌入模型中的集合将需要在适配器中进行额外的处理。

有关更多信息,请查看有关 Rivets.js Github 问题的这篇文章:
使用 data-each- 绑定绑定到 Backbone.Collection https://github.com/mikeric/rivets/issues/57

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Rivets.js 迭代 Backbone.js 模型的集合? 的相关文章

  • jQueryMobile:未捕获类型错误:无法调用未定义的方法“_trigger”

    我正在使用 jQuery Mobile 和backbone js 当我加载主页时出现以下错误 Uncaught TypeError Cannot call method trigger of undefined 这就是我加载主页的方法 在r
  • Rails:backbone-on-rails gem-

    尝试按照 Ryan Bates Backbone js 教程构建抽奖应用程序 但我已经遇到了第一部分代码的问题 在 application js 的 init 函数中 他初始化了 Raffler 路线的新实例 该实例应该触发警报 主页 但我
  • 使用 Backbone-Relational 实现多对多关系

    我有一个简单的应用程序 它定义了两个类 一个Person and a PersonGroup 其中存在多对多关系 一个人可以没有组 或者被分配到所有组 以及介于两者之间的任何组 backbonerelational org 上的示例建议对多
  • 依赖注入与托管依赖关系与全局对象

    我正在 Javascript BackboneJS 一个 MVC 框架 RequireJS 框架中工作 但这个问题有点 OO 通用 首先让我解释一下 在 Backbone 中 您的视图是传统视图和控制器的混合 而您的 HTML 模板是传统的
  • 在主干/下划线模板中使用循环

    我有一个backbone js underscore js 模板 我将其输入到主干视图中进行渲染 视图传递一个包含数组的模型posts对象 我称之为post在模板中 Problem 当我尝试循环遍历数组的所有元素时posts 我收到一个错误
  • Backbone.js 模型默认值和解析

    我有这个Backbone Model代表 Google Books API 卷 var Book Backbone Model extend defaults volumeInfo title n a authors n a publish
  • MarionetteJS:应用程序区域与布局[重复]

    这个问题在这里已经有答案了 我正在阅读最新版本 2 3 0 的文档 它说应用程序区域现已被弃用 应用领域 警告 已弃用 此功能已弃用 而不是使用 应用程序作为视图树的根 您应该使用布局 看法 要将布局视图的范围限制为整个文档 您可以设置 它
  • 如何填充 Backbone.js 集合的 _byId 数组以便我可以在其上使用“get”?

    我有一个收藏 并且collection models返回模型数组 然而 当我打电话时collection get someId 这个id是模型的idcollection models数组 我得到undefined 看着collection
  • 将 RequireJS 与遗留代码结合使用

    我正在处理一个非常大的项目 该项目使用 包含带有脚本标记的 javascript 文件的旧版 JSP 页面 使用其他 javascript 模块而不使用 RequireJS 的骨干模型和视图 现在 我们希望开始将 RequireJS 与 j
  • 大型应用程序的最佳backbone.js和require.js样板[关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在为我的应用程序寻找一个好的backbone js require js 样板 因为这将使我很好地
  • 引发一系列事件 Backbone event:name

    extend object Backbone Events object on myalert one function msg document body innerHTML eve1 msg msg name this name con
  • 如何提取 Backbone 集合的属性

    我想从 Backbone 集合创建一个特定属性值的数组 var days select this collection models function model return model attributes type session d
  • Marionette CompositeView 为 Collection 中的每个模型呈现自身,而不是 ItemView (Marionette Rails)

    基本上 我试图将 CompositeView 渲染为带有表头的简单四列列表 其中集合中的每个模型都渲染为 并附加到 我正在跟进德里克的一个例子 http jsfiddle net derickbailey me4NK 非常接近 只有一点点变
  • Socket.IO - 开放连接是一个问题吗?

    我目前正在与DerbyJS http derbyjs com 因为它促进了干净 干燥的客户端 服务器代码 附带好处 大多数人使用该框架的主要原因 是它使用 Socket IO 来创建实时应用程序 在这种情况下 我不need实时 但这是一个很
  • 如何检查侧边栏视图是否已经在主干中渲染?

    通常 用户通过主页进入网站 然后我在那里渲染侧边栏视图 接下来 用户单击链接 路由器呈现另一个视图并替换原始内容视图 侧边栏视图不会重新渲染 当用户在子页面上单击刷新时 侧边栏不会呈现 如何检查视图是否存在并且已渲染 划分责任并坚持下去 不
  • Backbone Marionette,复合视图初始化两次

    我正在使用一个复合视图 它的 el 上调用了 dialog 然后 复合视图列出集合中的项目 现在我尝试了多种方法来渲染集合项 在将其附加到视图之前和之后从复合视图外部获取 在视图内部获取 从我的服务器脚本预加载集合等 一切似乎都有效 但出现
  • 使用 Node.js 的前端 javascript 框架 [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • backbone.js直接设置模型内部属性hash

    使用 Backbone js 我知道强烈建议使用以下方法设置模型的属性set http documentcloud github com backbone Model set方法 而不是直接修改属性内部哈希 http documentclo
  • 谷歌地图通过骨干javascript返回div标签但不显示

    我已经开始使用地理定位 我可以获得坐标等 我想在地图中显示它 但是当我将地图返回到 div 时 什么也没有显示 现在我查看了 div 地图正在返回 但只是不可见 这是有问题的 div 请注意 这似乎只是一个小地图的链接 a style di
  • 首选的客户端路由解决方案? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi

随机推荐

  • MPAndroidChart - 饼图 - 自定义标签线

    我正在尝试使用 MPAndroidChart 和饼图绘制如图所示的标签线 我不知道如何 将线条与图表分离 在该行的开头画一个小圆圈 谢谢 这绝非易事 要将线条与图表分离 您可以使用valueLinePart1OffsetPercentage
  • lambda 中的自定义相交

    我想知道是否可以使用 lambda 表达式来解决这个问题 List
  • Kubernetes:用 Calico 替代 Flannel

    我是 Kubernetes 新手 我想尝试不同的 CNI 在我当前的集群中 我正在使用 Flannel 现在 我想使用 Calico 但我找不到清理 Flannel 和安装 Calico 的正确指南 您能指出正确的程序吗 Thanks Ca
  • 涉及优化器的局部变量构造和销毁

    如果我有这个代码 class A class B void dummy A a B b 我知道变量a and b将以相反的分配顺序销毁 b将首先被摧毁 然后a 但我可以确定优化器永远不会交换的分配和构造a and b 或者我必须使用vola
  • 有没有办法在 C++ 中调用类外部的基函数?

    这个问题是类似的 但是是关于从类内部调用函数 如果我重写基类的虚函数 我可以调用它吗 https stackoverflow com questions 672373 can i call a base classs virtual fun
  • 使用 Google 电子表格中的脚本从手机获取我的当前位置

    有没有办法使用 Google Apps 脚本从手机的 GPS 数据中获取我的当前位置 纬度和经度 最好是十进制形式 另外 是否可以打开和关闭 GPS 或者至少检测它是否打开或关闭 这是我尝试做的 我带着电动助力车去一些地方 在每个地方我都会
  • 指定 ghci 中“加载”操作的搜索路径

    In 加载源文件 http www haskell org ghc docs 7 6 1 html users guide loading source files html它指出查找源文件的搜索路径是使用 i 选项指定的 ghci idi
  • XDoclet,一个死工具?

    我正在使用最新的 Eclipse for Java EE 和最新的 JBoss Tools 插件 现在 我正在编写一些 EJB 2 x 代码 我找不到像以前一样生成 xdoclet build xml 文件的方法 经过一番调查后 我开始问自
  • 仅适用于我所在国家/地区的 Google 地图?

    如何在 Android 应用程序中使用 Google 地图 使其仅显示我的国家 地区 我的意思是 世界其他地方不会出现在应用程序中 查看其中之一迈克 威廉姆斯 http econym org uk gmap range htm很棒的 GMa
  • 请求头字段X-Requested

    我正在尝试访问谷歌云存储上的存储桶中的文件 我已经为存储桶设置了 CORS 配置 但当我通过 https 发出请求时 出现此错误 它适用于通过 http 发出的请求 XMLHttpRequest 无法加载 FILENAME 预检响应中的 A
  • 无限地重复可枚举

    是否存在无限重复可枚举的可枚举扩展方法 例如 给定一个返回的枚举 a b c 我想要一个返回无限重复序列的方法 a b c a b c a b c 这听起来有点像可观察 重复 http msdn microsoft com en us li
  • 如何像普通命令行程序一样从 shell 运行 sbt 主类?

    如何从 shell 运行 sbt 应用程序 以便我可以将我的应用程序作为普通的命令行程序运行 就像直接通过scala但不必设置巨大的类路径 我知道我能做到 echo hello sbt run main com foo MyMain3 ar
  • 当我在 Visual Studio 2017 的 C# 中调用方法时,是否有指向显式命名参数的快捷方式?

    在 C 中 我有一个带有许多参数的方法 我想使用所有命名参数调用该方法 VisualStudio 2017 中有执行此操作的快捷方式吗 我使用 EF6 并使用 SQL 2014 从具有 10 多个输入参数的存储过程生成方法 Method p
  • 如何将“&[email protected]”附加到 GoogleWebAuthorizationBroker

    我想将 login hint 附加到向 Google 发出的身份验证请求中 我正在使用以下代码 FileDataStore fDS new FileDataStore Logger Folder true GoogleClientSecre
  • 创建新的 SqlDataAdapter 时出现 C# InvalidOperationException

    我编写了一些代码来建立与 SQL Server 的连接 然后执行 select 过程以从 SQL Server 中的数据表中获取所有数据 但它在声明新的 SqlDataAdapter 的命令中抛出 InvalidOperationExcep
  • 如何使用 ASP.NET MVC 控制器操作将文件发送到浏览器?

    我有一个应用程序 允许我的用户上传任何类型的文件 我将其保存在服务器上的文件系统中 该应用程序只能由两个用户访问 因此我无需担心上传任何可疑文件 如何允许用户按下 MVC 表单上的按钮来请求通过浏览器发回文件并显示标准保存 打开对话框 我想
  • C# 如何获取 COM 接口的实例

    我做了很多谷歌搜索 试图找到获取 COM 接口实例的标准方法 微软在他们的文章中提供了一个例子COM 互操作第 1 部分 客户端教程 https msdn microsoft com en us library aa645736 v vs
  • WCF 绑定到 HTTPS

    我知道有很多关于此的帖子 并且我已经浏览了搜索中出现的所有帖子并实现了所提到的所有内容 我有一个 WCF Web 服务 可以在我的本地系统上使用 HTTP 运行 也可以在服务器上使用 HTTP 运行 但客户端要求这通过 HTTPS 进行 这
  • Oracle 中的重复行

    如何防止在选择查询中选择重复的行 我有一个包含以下字段的表 name type user1 user2 user3 date 我的查询要求我仅在用户在前端输入的时间为特定用户选择数据 假设用户输入 1 那么选择查询应仅检索 user1 的数
  • 使用 Rivets.js 迭代 Backbone.js 模型的集合?

    我在用着铆钉 js http rivetsjs com 对于 Backbone 项目中的两个双向数据绑定 并且希望实现迭代绑定 文档表明迭代绑定是可能的 但没有可用的示例 我正在使用一个简单的 Rails API 将 JSON 发送到客户端