avalon.js 1.4.6简单列表数据绑定ms-repeat ms-click

1.列表数据绑定

<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="avalon.js"></script>
    <script>
      var vm =avalon.define({
        $id:"root1",
        myDatas: [{ "name": "aaa" }, { "name": "bbb" }, { "name": "ccc" }, { "name": "ddd"}], /*ajax 请求后台返回的数据*/

doClick:function(data) {
alert(data.name);
console.log(data);
}

    })
    </script>
  </head>
  <body ms-controller="root1">
          <ul>
            <li ms-repeat="myDatas" ms-click="doClick(el)">{{$index}}--{{el.name}}</li>
          </ul>
  </body>
</html>

From:http://www.cnblogs.com/xuejianxiyang/p/5554146.html

时间: 2024-10-21 11:41:21

avalon.js 1.4.6简单列表数据绑定ms-repeat ms-click的相关文章

MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js 概念摘录

转自:http://www.cnblogs.com/xishuai/p/mvc-mvp-mvvm-angularjs-knockoutjs-backbonejs-reactjs-emberjs-avalonjs.html MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是将 M 和 V 的实现代码分离,从而使同一个程序可以使用不同的表现形式. 交互方式(所有通信都是单向的): View 传送指令到 Contro

JS基础(超级简单)

1     JS基础(超级简单) 1.1 数据类型 1.1.1   基本类型: 1)        Number:特别注意:NaN的检测方法:Nan!=NaN;或者使用isNaN方法 2)        string 3)        boolean 4)        null 5)        undefined 1.1.2   复杂类型 object:date,array,function 1.2 变量 var 变量名=值 变量的作用域:1.全局:以页面为单位.2局部:以函数为单位.

一款轻量级前端框架Avalon.Js

avalon2是一款基于虚拟DOM与属性劫持的 迷你. 易用. 高性能 的 前端MVVM框架, 拥有超优秀的兼容性, 支持移动开发, 后端渲染, WEB Component式组件开发, 无需编译, 开箱即用.上一个简单的入门例子: <!DOCTYPE html> <html> <head> <title>first example</title> <meta charset="UTF-8"> <meta na

avalon js实现仿google plus图片多张拖动排序

转载请注明: TheViper http://www.cnblogs.com/TheViper  效果 google plus 拖动+响应式效果: 要求 1. 两边对齐布局,即图片间间距一致,但左右两边的图片与边界的间距不一定等于图片间间距,兼容ie7,8,firefox,chrome.2. 浏览器尺寸变化,在大于一定尺寸时,每行自动增加或减少图片,自动调整图片间间距,以满足两边对齐布局,这时每张图片尺寸固定(这里是200*200px):而小于一定尺寸时,每行图片数量固定(这里最小列数是3),这

AngularJS简单的数据绑定

引用angularjs脚本库,在DOM元素上声明ng-app属性.ng-controller控制器,标签上使用ng-model指令.声明"myApp"模块(module)以及"myController"控制器(controller) 例子如下代码: <!doctype html> <html ng-app="myApp"> <head> <meta charset="utf-8">

关键词导致avalon.js不兼容IE

avalon.js是一款迷你的MVVM框架,设计者将其兼容到了IE6.轻巧的体积和良好的兼容使它非常适合国内的某些项目(学校.政府.银行).然而有时候居然出现了在ie上无法渲染的情况. 例如下列这段简单的demo: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title&g

更快学习 JS 的 6 个简单思维技巧

当人们尝试学习 JavaScript , 或者其他编程技术的时候,常常会遇到同样的挑战: 有些概念容易混淆,特别是当你学习过其他语言的时候. 很难找到学习的时间(有时候是动力). 一旦当你理解了一些东西的时候,却很容易再一次忘记. 可以使用的工具甚多且经常变化,所以不知道从哪里开始入手. 幸运的是,这些挑战最终都可以被战胜.在这篇文章里,我将介绍 6 个思维技巧来帮你更快的学习 JavaScript ,让你成为一个更快乐更多产的程序员. 1.不要让将来的决定阻止你进步 对于很多学习 JavaSc

Node.js学习笔记(3) - 简单的curd

这个算是不算完结的完结吧,前段时间也是看了好久的Node相关的东西,总想着去整理一下,可是当时也没有时间: 现在看来在整理的话,就有些混乱,自己也懒了,就没在整理,只是简单的记录一下 一.demo的简单介绍 这次demo,只涉及到简单的curd操作,用到的数据库是mongo,所以要安装mongo数据库,数据库连接驱动是mongoose: 当然关于mongo的驱动有很多,比如mongous mongoskin等:(详见http://cnodejs.org/topic/4f4ca8e0940ce2e

Node.js操作Redis的简单示例

Redis是一个key-value类型的数据库,而key全部都是字符串,value可以是集合.hash.list等等. Redis是通过MULTI/DISCARD/EXEC/WATCH这4个命令来实现事务功能.对事务,我们必须知道事务安全性是一个非常重要的. 事务提供了一种"将多个命令打包,然后一次性.按顺序执行"的机制,并且在事务执行期间不会中断--意思就是在事务完成之前,客户端的其他命令都是阻塞状态. var redis = require("redis");