avalon2学习教程05属性操作
avalon2与avalon1的属性操作虽然都是使用ms-attr,但用法完全不一样。
avalon1是这样操作属性的
其语法为
ms-attr-valueName="vmProp"
有多少个属性就写多个ms-attr-。其中不能省略。此外,还存在ms-title, ms-alt,ms-src, ms-href, ms-selected, ms-checked等等缩略写法。但估计很少人知道,到底哪些属性可以缩写,哪些不能。
avalon2从减轻用户的记忆出发,将你要操作的属性全部打包成一个对象,并规定,只能属性值才能使用@开头的vm属性。此外,avalon不存在ms-title这样的缩略写法。
或者
attrObj为vm的一个对象属性,但这个不太常用。
或者
ms-attr直接对应一个数组。这个灵感是来自ReactNative的style指令,它们可以通过数组,传入多个样式对象…………
不过无论你怎么搞,最后你传的东西能保持avalon内部能将它变回一个对象就行了。
有时你的对象很长,需要换行,avalon2也是支持的,即便你写得像以下这么恶心,avalon2还是能认出来。
TODO supply a title
var vm = avalon.define({
$id: "test",
title:111,
src: "222",
lang: 333
})
{{
@src ? 333: 'empty'
}}
但为了性能起见,ms-attr最好还是保持在一行吧。
avalon2的ms-attr可以支持过滤器,但没有提供现成的过滤器,虽然用户进行编写。不过需要注意的是,这个过滤器要处理的是{title:'111',ddd: '222', lang:222}这样的对象,而不是一个字符串。比如我们要将需要个属性转换成日期格式,你可以在你的过滤器里调用avalon自带的date过滤器。
avalon2学习教程05属性操作的更多相关文章
- avalon2学习教程06样式操作
avalon2的ms-css的变革思路与ms-attr一样,将多个操作合并成到一个对象里面处理,因此没有ms-css-name="value",只有ms-css="Obj ...
- jQuery源代码学习之八——jQuery属性操作模块
一.jQuery属性模块整体介绍 jQuery的属性操作模块分四个部分:html属性操作,dom属性操作,类样式操作,和值操作. html属性操作(setAttribute/getAttribute) ...
- js学习笔记2---HTML属性操作
1.HTML属性操作:读.写 属性名 属性值 2.属性读操作:获取.找到 a) 语法:元素.属性名 如:document.getElementById(“btn”).value; b) 字符串的连 ...
- avalon2学习教程08插入移除操作
本节介绍的ms-if指令与ms-visible很相似,都是让某元素"看不见",不同的是ms-visible是通过CSS实现,ms-if是通过移除插入节点实现. ms-if的用法与1 ...
- avalon2学习教程15指令总结
avalon的指令在上一节已经全部介绍完毕,当然有的语焉不详,如ms-js.本节主要总结我对这方面的思考与探索. MVVM的成功很大一语分是来自于其指令,或叫绑定.让操作视图的功能交由形形式式的指令来 ...
- avalon2学习教程13组件使用
avalon2最引以为豪的东西是,终于有一套强大的类Web Component的组件系统.这个组件系统媲美于React的JSX,并且能更好地控制子组件的传参. avalon自诞生以来,就一直探索如何优 ...
- avalon2学习教程09循环操作
avalon2的循环指令的用法完全改变了.avalon最早期从knockout那样抄来ms-each,ms-with,分别用于数组循环与对象循环.它们都是针对元素内容进行循环.后来又从angular那 ...
- Python入门学习教程:数据库操作,连接MySql数据库
各位志同道合的同仁可以点击上方关注↑↑↑↑↑↑ 本教程致力于程序员快速掌握Python语言编程. 本文章内容是基于上次课程Python教程:Python教程:连接数据库,对数据进行增删改查操作 和py ...
- avalon2学习教程02之vm
avalon2的vm是一个非常重要的东西,其设计原型最初脱胎于knockout.js,但到avalon1.6中,终于寻得自己的方案,更精简,更易用,更魔幻. vm是一种特殊的数据结构,看起来像普通对象 ...
随机推荐
- crm 2016 tabstatechange event
1 tabstatechange事件在窗体中定义 2 问题是如果选项卡默认为折叠的.且选项卡中包含了iFrame网页. 3 在网页内容加载完成之后,点击选项卡 折叠/展开 按钮, iFrame网页没有 ...
- POJ3159 Candies
#include <iostream> #include <queue> #include <cstring> #define maxn 30005 #define ...
- 聊天对话框(ctrl+enter发送)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- mysql千万级数据库插入速度和读取速度的调整记录
一般情况下mysql上百万数据读取和插入更新是没什么问题了,但到了上千万级就会出现很慢,下面我们来看mysql千万级数据库插入速度和读取速度的调整记录吧. 1)提高数据库插入性能中心思想:尽量将数据一 ...
- tornado 和 djanjo 转义处理对比
tornado tornado默认是转义所有字符,比较安全,但有时候我们的确需要把字符当做html来解析处理,因此我们需要做些处理. 所有的模板输出都已经通过 tornado.escape.xhtml ...
- day5--装饰器函数的信息打印,迭代器,生成器,列表推导式,内置函数
本文档主要内容: 一 装饰器函数的信息打印 二 迭代器 三 生成器 四 生成器表达式和列表推导式 五 内置函数 一 装饰器函数的信息打印 一个函数一旦被装饰器给装饰后,这个函数的信息使用原来的命令打印 ...
- java se 随机数。生成
public class test { public static void main(String[] args) { getRandomNum1(); getRandomNum2(); getRa ...
- sql server无log ldf日志文件附件mdf数据库重新生成ldf日志文件
CREATE DATABASE TestDB ON ( FILENAME ='D:\TestDB.mdf' --路径 ) for ATTACH_REBUILD_LOG
- python中的remove
remove()从左到右寻找,移除找到的第一个指定元素,举个例子: 1 a = ["hello", "world", "world", &q ...
- 设计模式、j2ee 部 分、EBJ 部 分
八. 软 件 工 程 与 设 计 模 式 1 .UML 方 面 标准建模语言 UML.用例图,静态图(包括类图.对象图和包图),行为图,交互图(顺序图,合作 图),实现图. 2 .j2ee 常 用 的 ...