Define a collection:

var AppointmentList = Backbone.Collection.extend({model: Appointment});

RESET the json:

var appointments = new AppointmentList();
var json = [
{title: 'Back pain'},
{title: 'Dry mouth'},
{title: 'Headache'}
];
appointments.reset(json);

Get url and fetch json data:

var AppointmentList = Backbone.Collection.extend({
url: '/appointments',
model: Appointment
});
var appointments = new AppointmentList(); appointments.fetch();

This Dr. Goodparts does not trust us when we tell him we are successfully loading data from the server into our collection.

To prove him wrong, display an alert with the number of items in the collection by listening for the reset event.

var appointments = new AppointmentList();
appointments.fetch();
appointments.on('reset', function(){
alert(appointments.length);
});

Wouldn't ya know, our users don't like getting alerts every time we fetch new data for our collection.

Update the fetch call below to not fire the reset event.

//By default, when fetch or add model, the reset event will be triggered.
//TO disable the reset event, can use
appointments.fetch({silent: true});

Use an event listener to log to the console the model's title anytime a model is added to the appointments collection.

var appointments = new AppointmentList();
appointments.on('add', function(appointment){
console.log(appointment.get('title'));
});

There are a lot of appointments in our collection and Dr. Goodparts wants a list of all appointment titles so he can arrange his equipment for the day.

Use the map iteration function to return an array of appointment titles and assign to the titles variable.

var titles = new Array();
appointments.map(function(appoinment){
titles.push(appoinment.get('title'));
});

[Backbone]6. Collections.的更多相关文章

  1. Backbone.js 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构

    Backbone.js 为复杂Javascript应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和 自定义事件:集合附有可枚举函数 ...

  2. 前端MVC框架Backbone 1.1.0源码分析(一)

    前言 如何定义库与框架 前端的辅助工具太多太多了,那么我们是如何定义库与框架? jQuery是目前用的最广的库了,但是整体来讲jQuery目的性很也明确针对“DOM操作”,当然自己写一个原生态方法也能 ...

  3. TodoMVC中的Backbone+MarionetteJS+RequireJS例子源码分析之二 数据处理

    当我们使用jQuery时大部分时间是聚焦于Dom节点的处理,给Dom节点绑定事件等等:前端mvc框架backbone则如何呢? M-Model,Collection等,是聚焦于数据的处理,它把与后台数 ...

  4. TodoMVC中的Backbone+MarionetteJS+RequireJS例子源码分析之一

    Marionette牵线木偶,Backbone是脊骨的意思,Marionette是基于Backbone做扩展库,可以理解为把脊骨骨架绑线扯着变成牵线木偶动起来哈哈,使backbone更易使用呵呵! 构 ...

  5. Django+Tastypie作后端,RequireJS+Backbone作前端的TodoMVC

    一.配置好环境 接着前一篇的例子,顺带测试一下已下载下来example里面的backbone_require的例子 注意:直接本地用backbone.localStorage插件运行TodoMVC会报 ...

  6. Django+Tastypie作后端,Backbone作前端的TodoMVC

    TodoMVC是各种js框架入门的比较经典的例子,详细可查看github地址https://github.com/tastejs/todomvc 接着上篇文章, 1,先在github上把backbon ...

  7. MVVM与Backbone demo

    MVVM https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93viewmodel

  8. Backbone的一点使用心得

    Backbone的其实感觉上上手很难,大概在一年前就想实践下,结果总是没有付诸行动,这次需求中狠狠心决定一定要使用一次看看,感受下. 可是第一步真的比较困难,因为直接看API好像没有感觉就在网上找实例 ...

  9. Backbone.js学习之Backbone.View(视图)

    Backbone.js为复杂WEB应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和自定义事件:集合附有可枚举函数的丰富API: 视 ...

随机推荐

  1. Navicat Premium 激活码 序列号。破解版。

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha Navicat Premium 激活码  序列号.破解版.

  2. luoguP2303 [SDOI2012]Longge的问题 化式子

    求\(\sum \limits_{i = 1}^n gcd(i, n)\) \(\sum \limits_{i = 1}^n gcd(i, n)\) \(=\sum \limits_{i = 1}^n ...

  3. 如何离线安装GitHub for windows?

    此文献给xp用户和被墙用户. 今天群里(GitHub家园 225932282)有人说GitHub for windows安装不上,错误提示如下,看了下感觉应该是被墙了,我试了试下面的网址,没问题,所以 ...

  4. 【洛谷】4304:[TJOI2013]攻击装置【最大点独立集】【二分图】2172: [国家集训队]部落战争【二分图/网络流】【最小路径覆盖】

    P4304 [TJOI2013]攻击装置 题目描述 给定一个01矩阵,其中你可以在0的位置放置攻击装置. 每一个攻击装置(x,y)都可以按照“日”字攻击其周围的8个位置(x-1,y-2),(x-2,y ...

  5. PIXIV 爬取国际前100名代码

    PYTHON爬虫 爬取PIXIV国际前100名的代码 代码是别人的,那天学习爬虫的时候看到了,写的很厉害~ 学习学习 #coding:UTF-8 __author__ = 'monburan' __v ...

  6. BZOJ 1196: [HNOI2006]公路修建问题 Kruskal/二分

    1196: [HNOI2006]公路修建问题 Time Limit: 1 Sec  Memory Limit: 162 MB 题目连接 http://www.lydsy.com/JudgeOnline ...

  7. HDU 4268 Alice and Bob 贪心STL O(nlogn)

    B - Alice and Bob Time Limit:5000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u D ...

  8. 通过IP获取所在城市

    <script type="text/javascript"> var map = new BMap.Map("allmap"); var poin ...

  9. java中的几种对象(PO,VO,DAO,BO,POJO)

    一.PO :(persistant object ),持久对象 可以看成是与数据库中的表相映射的java对象.使用Hibernate来生成PO是不错的选择. 二.VO :(value object) ...

  10. MyBatis接口的简单实现原理

    MyBatis接口的简单实现原理 用过MyBatis3的人可能会觉得为什么MyBatis的Mapper接口没有实现类,但是可以直接用? 那是因为MyBatis使用Java动态代理实现的接口. 这里仅仅 ...