当前位置:  软件>JavaScript软件

双向数据绑定JS库 Bindable.js

    来源:    发布时间:2014-12-30

    本文导语:  Bindable.js 实现了灵活、快速的双向数据绑定的 JavaScript 库。 Two-way data binding means linking properties of two separate objects - when one changes, the other will automatically update with that change.  It enables much easier interactions between data models and UIs, among ot...

Bindable.js 实现了灵活、快速的双向数据绑定的 JavaScript 库。

Two-way data binding means linking properties of two separate objects - when one changes, the other will automatically update with that change.  It enables much easier interactions between data models and UIs, among other uses outside of MVC.

Bindable.js is similar to Ember's data-binding system, except it doesn't include anything View related, so the library has many use-cases - whether replacing Backbone's Model, providing a way to maintain the state between server client for a realtime front-end application (similar to Firebase), or perhaps a way to communicate between server server for a realtime distributed Node.js application.

Projects using bindable.js
  • Paperclip.js - data-bindable templating engine.

  • Sherpa.js - online tours library

  • Mojo.js - javascript MVC framework.

  • AWSM - aws library.

  • ditto - synchronized user interactions across browsers.

示例代码:

var bindable = require("bindable");

var person = new bindable.Object({
  name: "craig",
  last: "condon",
  location: {
    city: "San Francisco"
  }
});

person.bind("location.zip", function(value) {
  // 94102
}).now();

//triggers the binding
person.set("location.zip", "94102"); 

//bind location.zip to another property in the model, and do it only once
person.bind("location.zip", { to: "zip", max: 1 }).now();

//bind location.zip to another object, and make it bi-directional.
person.bind("location.zip", { target: anotherModel, to: "location.zip", bothWays: true }).now();

//chain to multiple items, and limit it!
person.bind("location.zip", { to: ["property", "anotherProperty"], max: 1 }).now();


//you can also transform data as it's being bound
person.bind("name", {
  to: "name2",
  map: function (name) {
    return name.toUpperCase();
  }
}).now();

    
 
 

您可能感兴趣的文章:

  • JavaScript 双向数据绑定库 Way.js
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • C++ Double Ended Queues(双向队列) 成员 empty():返回真如果双向队列为空
  • c++双向链表操作示例(创建双向链、双向链表中查找数据、插入数据等)
  • C++ Double Ended Queues(双向队列) 成员 Operators:比较和赋值双向队列
  • C语言双向链表 Doubly Linked List
  • C++ Double Ended Queues(双向队列) 成员 resize():改变双向队列的大小
  • 客户机和服务器可以双向收发数据的socket编程
  • C++ Double Ended Queues(双向队列) 成员 swap():和另一个双向队列交换元素
  • PHP双向队列实现代码
  • C++ Double Ended Queues(双向队列) 成员 size():返回双向队列中元素的个数
  • php开源软件 iis7站长之家
  • C++ Double Ended Queues(双向队列) 成员 assign():设置双向队列的值
  • C#实现https双向认证的实例代码
  • C++ Double Ended Queues(双向队列) 成员 get_allocator():返回双向队列的配置器
  • 客户端程序和服务器程序间能否通过管道来实现数据的双向传递啊?
  • C++ Double Ended Queues(双向队列) 成员 max_size():返回双向队列能容纳的最大元素个数
  • 为什么linux与windows电脑连接非常慢,双向都是!
  • C++ Double Ended Queues(双向队列) 成员 insert():插入一个元素到双向队列中
  • 如何在使用嵌入式Linux的设备中通过USB端口与PC进行双向通信
  • C++ Double Ended Queues(双向队列) 成员 Constructors:创建一个新双向队列
  • mysql 双向同步的键值冲突问题的解决方法分享
  • C++ Double Ended Queues(双向队列) 成员 at():返回指定的元素
  • codeigniter集成ucenter1.6双向通信的解决办法


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3