工作原因要用到avalon二次开发, 但是看了下以前的avalon版本是1,现在大多数都是2版本了吧,,所以很多文档不好找,但是大多数还是好用的

ms-repeat

循环当前赋值的,

ms-repeat:加载需要循环显示的子元素上:默认el
ms-repeat-item–>修改为item
ms-each:作用到需要循环子元素的父元素上

HTML正文:

<body ms-controller="test">
<p>数组遍历</p>
<!-- $index:下标
$last最后一个元素 -->
<ul>
<li ms-repeat-item="array">{{item}}---->{{$index}}</li>
</ul><br> <p>ms-each</p>
<ul ms-each="array">
<li>{{el}}<span ms-if="!$last">--></span></li>
</ul><br> <!-- $key:属性名 $val属性值 ms-with类似ms-each-->
<p>ms-repeat对象属性遍历</p>
<ul>
<li ms-repeat="objects">{{$key}}-->{{$val}}</li>
</ul><br> <p>ms-with对象属性遍历</p>
<ul ms-with="objects">
<li>{{$key}}-->{{$val}}</li>
</ul>
</body>

JavaScript操作代码:

 var vm=avalon.define({
$id:"test",
array:[111,222,333],
objects:{aaa:"1111",bbb:"2222",ccc:"3333"}
});

效果:

有点要注意的是,ms-repeat似乎不能利用当前的键值进行判断,需要放到下一级

比如,下面这个,判断只显示第一个,这样是不行的

        <img ms-repeat="lunlist" onerror="this.src='images/buy/x_02.png'" ms-src="el.image" ms-attr-id="$index" ms-if="$index==0" style="width: 100%;height: 210px;"/>

需要改为第二级判断

<div ms-repeat="lunlist">
<img onerror="this.src='images/buy/x_02.png'" ms-src="el.image" ms-attr-id="$index" ms-if="$index==0" style="width: 100%;height: 210px;"/>
</div>

当然 $last 判断也是一样  键值$index 是从0 开始的

avalon ms-repeat avalon1的更多相关文章

  1. avalon组件

    如何做一个avalon组件 在avalon1.5中改用更直观的自定义标签来声明组件,废掉ms-widget,引入更强大的生命周期管理,可以让组件任意套嵌. 组件是由JS,HTML,CSS构成 JS 以 ...

  2. webpack 集成 jQuery 和 Avalon

    webpack 系列 三:webpack 如何集成第三方js库 webpack系列目录 webpack 系列 一:模块系统的演进 webpack 系列 二:webpack 介绍&安装 webp ...

  3. 如何做一个avalon组件

    在avalon1.5中改用更直观的自定义标签来声明组件,废掉ms-widget,引入更强大的生命周期管理,可以让组件任意套嵌. 组件是由JS,HTML,CSS构成 JS 以AMD形式组织,引入HTML ...

  4. 迷你MVVM框架 avalonjs 学习教程22、avalon性能大揭密

    avalon之所以能在页面处理1W个绑定(angular对应的数字是2000),出于两个重要设计--基于事件驱动的双向绑定链及智能CG回收机制. avalon的双向绑定链是通过Object.defin ...

  5. 前端MVVM框架avalon揭秘 - HTML编译器

    MVVM试图更加清晰的讲用户界面(UI)开发从应用程序的业务逻辑与行为中心分离,因为,很多这样的模式的实现都需要利用声明式数据绑定来实现讲View(视图)工作从其他层分离 所以出现了一大堆自定义的声明 ...

  6. 基于avalon1.4.x ----分页组件编写

    avalon分页组件 (1.4.x版本) 随着avalon2的推出,avalon1的官网已经不再维护了,现在似乎是找不到avalon 1.4版本的官方文档了,所以本文章所有的内容均不保证正确性,只能保 ...

  7. Repeat Number

    Problem B: Repeat Number Time Limit: 1 Sec  Memory Limit: 32 MB Description Definition: a+b = c, if ...

  8. avalon与双缓冲技术

    avalon与双缓冲技术 avalon1.5一个重要技术升级是引进异步渲染.异步渲染在游戏界有一个更专业的名字,叫双缓冲.游戏界要刷新界面与我们刷新浏览器视图,面临的问题是一致的.视图是由许多存在套嵌 ...

  9. MVVM框架avalon在兼容旧式IE

    迷你MVVM框架avalon在兼容旧式IE做的努力 当前标签: avalon 共3页: 1 2 3 下一页  迷你MVVM框架avalon在兼容旧式IE做的努力 司徒正美 2014-03-13 11: ...

随机推荐

  1. Kure讲HTML_div标签和table标签

    为什么要把这两个标签放在一起讲? 个人认为div标签可以算是一个万能标签,它可以通过CSS(层叠样式表)来模仿表格的形式来生成一个表格.那么很多人可能会疑惑那在开发的时候,到底是用div+css的形式 ...

  2. SpringMVC restful风格

    1.Spring对REST的支持 Spring3(这里讨论Spring3.2+)对Spring MVC的一些增强功能为REST提供了良好的支持.Spring对开发REST资源提供以下支持: 操作方式: ...

  3. pat05-图2. Saving James Bond - Easy Version (25)

    05-图2. Saving James Bond - Easy Version (25) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作 ...

  4. JEECMS站群管理系统-- 首页的加载过程

    在浏览器中输入http://localhost:8080/jeecms,回车 首先进入配置文件web.xml, <context-param> <param-name>cont ...

  5. jqGrid方法整理

    一.colModel 表体结构配置 name 必要的属性,具有唯一标识性,如在弹出的editform窗体中,将作为input的name属性 index        为排序用,最方便的是设为数据库字段 ...

  6. POJ 3164——Command Network——————【最小树形图、固定根】

    Command Network Time Limit: 1000MS   Memory Limit: 131072K Total Submissions: 15080   Accepted: 4331 ...

  7. 【Iperf】iperf测试wlan的性能

    1.概念: iperf命令是一个网络性能测试工具.iperf可以测试TCP和UDP带宽质量. iperf可以测量最大TCP带宽,具有多种参数和UDP特性.iperf可以报告带宽,延迟抖动和数据包丢失. ...

  8. Ibatis.net 1.6.2 简单配置及Log4.Net日志记录

    看似简单的Ibatis配置起来注意的地方还挺多.里面的设置及功能还算强大.昨晚配置了半宿,结果一运行还是各种错误.急的直冒汗.果断下载实例去研究.英文不好文档只能作为功能参考. 下面一步步进入Ibat ...

  9. 洛谷P3372 【模板】线段树 1(树状数组)

    题意 题目链接 Sol Get到了这题树状数组的做法,感觉非常nice 区间加:直接差分 区间求和:考虑每一位的贡献 \(sum_{i = 1}^x (x+1 - i) d_i\) \(= sum_{ ...

  10. 详解__FILE__与$_SERVER['SCRIPT_FILENAME']的区别

    废话不多说 直接上测试代码: <?php //引入的是ceshi4文件夹下的ceshi4.php; require_once './ceshi4/ceshi4.php'; 下面是ceshi4文件 ...