[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_11":-5},"routes/user.$name.collections",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":16},"topics",[35],"user",{"_20":21,"_13":14,"_22":23,"_24":14,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34},"loginname","kankungyip","page",1,"limit",20,"total","id","12172","avatar_url","https://avatars.githubusercontent.com/u/1096425?v=3","githubUsername","create_at","2014-04-04 09:44:21.663","score",40,"topic_count",5,"reply_count",3,"is_star",false,{"_20":36,"_37":21,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":34,"_31":49,"_50":51,"_25":52,"_53":54},"13827","author_id","tab","share","content","# modelite.js\r\n\r\n轻量级双向数据绑定工具。\r\n\r\n [https://github.com/kankungyip/modelite.js](https://github.com/kankungyip/modelite.js)\r\n\r\n## 特点\r\n\r\n1. **简单**\r\n2. **轻量**\r\n3. **持久**\r\n\r\n## 安装\r\n\r\n```html\r\n\r\n```\r\n\r\n_* 需要 jQuery 库。_\r\n\r\n## 快速入门\r\n\r\n无需编写任何代码，将 DOM 元素的 `name` 属性和数据名对应，就可以完成绑定。\r\nDOM 的层次关系也就是数据对象的层次。\r\n\r\n```html\r\n \r\n\r\n Name: \r\n```\r\n\r\n在内存中储存的数据为：\r\n\r\n```json\r\n{\r\n \"data\": {\r\n \"name\": \"\",\r\n \"age\": \"\",\r\n \"gender\": \"\"\r\n }\r\n}\r\n```\r\n\r\n## 选项属性\r\n\r\n对 DOM 元素使用以下 `ml-` 属性可以实现对数据的简单操作和显示控制。\r\n\r\n属性 | 类型 | 默认值 | 说明\r\n----|----|----|----\r\n`default` | `String` | `null` | 数据的默认值。\r\n`placeholder` | `String` | `null` | 数据为空值时标签元素上可以显示的值，该值不储存。\r\n`reserve` | `Number` | `0` | 对于 `Array` 类型的数据，必须保留的数据数量，不足时用默认值填充。\r\n`repeat` | `String` | `all` | 循环模版标签元素时，控制模版显示的方式，可选择值：`header`，`footer`，`body`，`odd`，`even` 和 `all`，，使用详见后文。\r\n`insert` | `String` | `null` | 插入动作，往 `Array` 中插入新数据，使用详见后文。\r\n`remove` | `String` | `null` | 删除动作，删除 `Array` 中的数据，使用详见后文。\r\n`events` | `String` | `null` | 触发的事件，使用详见后文。\r\n\r\n实例：\r\n\r\n```html\r\n \r\n```\r\n\r\n```html\r\n \r\n```\r\n\r\n```html\r\n \r\n```\r\n\r\n## 循环\r\n\r\n将 DOM 元素（及其子元素）指定为模版，绑定的 `Array` 类型数据的每一个值都会用该模版显示出来。\r\n指定为模版的 DOM 元素只需要用 `#` 作为 `name` 属性的值，并且将该元素包裹在绑定对应 `Array` 类型数据的父元素内。\r\n\r\n```html\r\n

\r\n

\r\n \r\n \r\n

\r\n

\r\n```\r\n\r\n在内存中储存的数据为：\r\n\r\n```json\r\n{\r\n \"people\": [\r\n {\r\n \"name\": \"\",\r\n \"age\": \"\"\r\n }\r\n ]\r\n}\r\n```\r\n\r\n如果模版子元素的 `name` 属性值为 `$`，则可以用来表示直接将使用数组元素的值。\r\n\r\n```html\r\n

\r\n

\r\n```\r\n\r\n### 循环选项\r\n\r\n通过 `ml-reserve` 和 `ml-repeat` 两个选项来控制数据显示的方式。\r\n\r\n如果需要在显示时候指少保留 `n` 个默认项，则使用 `ml-reserve=\"n\"` 来设置保留项的个数。`ml-reserve` 必须在循环的父元素属性中设置。\r\n\r\n```html\r\n \r\n```\r\n\r\n如果要控制模版在循环时特定时候显示或隐藏，则使用 `ml-repeat=\"header|footer|body|odd|even|all\"` 来控制只在设定的状态下才显示。\r\n\r\n* `header` 循环第一次显示\r\n* `footer` 循环最后一次显示\r\n* `body` 非循环的第一次或最后一次显示\r\n* `odd` 奇数次循环显示\r\n* `even` 偶数次循环显示\r\n* `all` **默认值**，始终显示。\r\n\r\n```html\r\n

\r\n

Name: Age

\r\n

\r\n :\r\n \r\n

\r\n

End

\r\n

\r\n```\r\n\r\n## 动作\r\n\r\n依据循环的模版对绑定的 `Array` 类型数据执行插入（`ml-insert`）和删除（`ml-remove`）操作，新插入的值均使用模版中定义的默认数据。\r\n\r\n插入和删除动作的属性值为绑定数据的 `keypath`，如果 `keypath` 中不包含 `index`，则默认为最后一项。\r\n\r\n```html\r\n \r\n \r\n \r\n```\r\n\r\n如果 `keypath` 中包含 `#`，则会自动替换成当前模版的 `index` （使用在模版的子元素上才有效）。\r\n\r\n```html\r\n

\r\n

\r\n \r\n \r\n \r\n

\r\n

\r\n```\r\n\r\n## APIs\r\n### `ml(keypath [,value])`\r\n\r\n获取或设置绑定的 `keypath` 数据的 `value`。\r\n\r\n### `ml.clear(keypath)`\r\n\r\n清除绑定的 `keypath` 数据。\r\n\r\n### `ml.insert(keypath, value)`\r\n\r\n向绑定的 `Array` 类型的 `keypath` 数据插入新 `value`，`keypath` 中如果没有指定 `index` 则默认插入到最后一个元素。\r\n\r\n### `ml.remove(keypath)`\r\n\r\n从绑定的 `Array` 类型的 `keypath` 数据删除一个元素，`keypath` 中如果没有指定 `index` 则默认删除最后一个元素。\r\n\r\n### `ml.emit(keypath, eventType)`\r\n\r\n通过绑定数据的 `keypath` 查询 DOM 元素，然后手动触发 `eventType` 类型事件。\r\n\r\n### `ml.emit(eventName [,eventArgs...])`\r\n\r\n手动触发 `eventName` 事件，并且传递事件参数表 `eventArgs...`。\r\n\r\n---\r\n\r\nThe MIT License (MIT)\r\n\r\nCopyright (c) 2015 Kan Kung-Yip\r\n\r\nPermission is hereby granted, free of charge, to any person obtaining a copy\r\nof this software and associated documentation files (the \"Software\"), to deal\r\nin the Software without restriction, including without limitation the rights\r\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\r\ncopies of the Software, and to permit persons to whom the Software is\r\nfurnished to do so, subject to the following conditions:\r\n\r\nThe above copyright notice and this permission notice shall be included in\r\nall copies or substantial portions of the Software.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\r\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\r\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\r\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\r\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\r\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\r\nTHE SOFTWARE.","title","项目需要造了个轮子，轻量级双向数据绑定工具 modelite.js","last_reply_at","2015-09-14 01:19:22.231","good",true,"top",6,"visit_count",9258,"2015-09-02 14:46:37.523","author",{"_13":14,"_22":23}]