avalon2 第一个demo
<!DOCTYPE html> <html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> </head>
<body ms-controller='test'>
<h1>soleSlot的使用, 它会组件容器中innerHTML替换生成组件的slot元素</h1>
<div >
<xmp :widget="{is:'ms-button'}" :click="@ddd" :attr="{title:@bb}">{{@bb}}</xmp>
{{aaaa}}
<p><button :click="@click">click</button></p> </div> {{name}} <script src="lib/jquery-1.8.3.min.js"></script>
<script src="lib/avalon.js"></script>
<script src="js/test.js"></script>
</body>
</html>
var vm;
function initVm() {
avalon.component('ms-button', {
template: '<button type="button"><span><slot /></span></button>',
defaults: {
buttonText: "button"
},
soleSlot: 'buttonText'
})
avalon.ready(function() {
vm = avalon.define({
$id: 'test',
aaa: {
buttonText: "vm中的值"
},
bb: '动态内容',
aaaa: '动态内1容',
name: 'lslsl',
ddd: function() {
console.log('xxxx')
},
click: function() {
vm.bb = '更新内容' + (new Date - 0)
}
})
avalon.scan(document.body);
});
}
$(function() {
initVm();
});
avalon2 第一个demo的更多相关文章
- angular开发者吐槽react+redux的复杂：“一个demo证明你的开发效率低下”
曾经看到一篇文章,写的是jquery开发者吐槽angular的复杂.作为一个angular开发者,我来吐槽一下react+redux的复杂. 例子 为了让大家看得舒服,我用最简单的一个demo来展示r ...
- 初识nginx之第一个demo
商城项目做了一个多月了,想到必须用到负载均衡,简单了解了一下nginx,首先分享第一个demo,五月份上线后,会继续分享一系列相关知识. 在nginx根目录下,用了一个园友的批处理文件nginx.ba ...
- springMvc的第一个demo
1.下载jar包 http://repo.spring.io/libs-release-local/org/springframework/spring/4.2.3.RELEASE/ 2.下载源码 j ...
- Android 通知栏Notification的整合 全面学习 （一个DEMO让你完全了解它）
在android的应用层中,涉及到很多应用框架,例如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架,通知机制,ActionBar框架等等. ...
- 如何在WTL和MFC中使用duilib及如何静态使用duilib库！（初级讲解 附带一个Demo）
关于duilib的历史,我也就不多说了,能看到这篇文章的人都是有一定了解才能找到这个的. 我直接说下对这个库的基本使用吧. 我个人对一些好技术都是比较感兴趣的. 因为个人原因 喜欢接触一个好技术. 所 ...
- 白盒测试之gtest第一个demo
认识gtest工具后,关于它的使用,下面将用一个demo程序演示一下gtest的用法以及成果展示. 一.需要测试的C++代码: #include "myfunction.h" // ...
- 在VS中实现webService的一个demo（图解）
在VS中实现webService的一个demo(图解) 先创建一个web项目,创建好web项目后,添加新建项——web服务 在新建好的web服务文件中写如下代码: 生成当前解决方案. 新建一个winf ...
- Cocos2d-x 学习（1）—— 通过Cocos Studio创建第一个Demo
近期在工作上有了比較大的转变,自学情绪也慢慢高涨,本来一直在研究unity的技术.由于换了工作会開始接触cocos2d-x.但并不意味着停止研究unity,以后有时间还是会继续的. 公司的cocos2 ...
- 使用android的mediaplayer做成 一个demo,欢迎测试使用
附件是为一个定制视频产品而简单的写了一个demo,用来说明android的mediaplayer是如何使用的. http://files.cnblogs.com/guobaPlayer/palyerD ...
随机推荐
- 用 Python 写一个 NoSQL 数据库Python
NoSQL 这个词在近些年正变得随处可见. 但是到底 “NoSQL” 指的是什么? 它是如何并且为什么这么有用? 在本文, 我们将会通过纯 Python (我比较喜欢叫它, “轻结构化的伪代码”) 写 ...
- LintCode刷题笔记--Longest Increasing Subsequence
标签: 动态规划 描述: Given a sequence of integers, find the longest increasing subsequence (LIS). You code s ...
- SQL中null比较的雷区
SQL中遇到null要格外小心! oracle最坑: oracle中在可为null的字段上做逻辑关系运算要格外小心,如 <>,>,=,<,任何与null的运算结果都返回fals ...
- 常用css3属性
总结一下在工作用常用到的属性设置 1.设置文本的可选择性 -webkit-user-select:none/text 2.设置背景的绘制区域 background-clip:border-box/pa ...
- Eclipse创建jsp web项目
Eclipse 是一个开放源代码的.基于Java的可扩展开发平台.就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境.幸运的是,Eclipse 附带了一个标准的插件集,包括Java开 ...
- Leetcode892.Surface Area of 3D Shapes三维形体的表面积
在 N * N 的网格上,我们放置一些 1 * 1 * 1 的立方体. 每个值 v = grid[i][j] 表示 v 个正方体叠放在单元格 (i, j) 上. 返回结果形体的总表面积. 示例 1: ...
- Liferay Model Hints
这篇文章主要介绍如何通过model hint 来修改liferay builder service生成数据库表中默认字段的长度. 1.什么是Model Hints? 它是对liferay builde ...
- PLAY2.6-SCALA(十二) 表单的处理
一.表单处理流程如下 1.定义一个表单,在这里表单最多有22个字段 import play.api.data._ import play.api.data.Forms._ //要使用验证和约束 imp ...
- 【JZOJ3213】【SDOI2013】直径
╰(￣▽￣)╭ 小 Q最近学习了一些图论知识.根据课本,有如下定义. 树:无回路且连通的无向图,每条边都有正整数的权值来表示其长度.如果一棵树有N个节点,可以证明其有且仅有 N-1 条边. 路径:一棵 ...
- 手机端 echarts使用 svg渲染器
// 使用 Canvas 渲染器(默认) var chart = echarts.init(containerDom, null, {renderer: 'canvas'}); // 等价于: var ...