<!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的更多相关文章

  1. angular开发者吐槽react+redux的复杂：“一个demo证明你的开发效率低下”

    曾经看到一篇文章,写的是jquery开发者吐槽angular的复杂.作为一个angular开发者,我来吐槽一下react+redux的复杂. 例子 为了让大家看得舒服,我用最简单的一个demo来展示r ...

  2. 初识nginx之第一个demo

    商城项目做了一个多月了,想到必须用到负载均衡,简单了解了一下nginx,首先分享第一个demo,五月份上线后,会继续分享一系列相关知识. 在nginx根目录下,用了一个园友的批处理文件nginx.ba ...

  3. springMvc的第一个demo

    1.下载jar包 http://repo.spring.io/libs-release-local/org/springframework/spring/4.2.3.RELEASE/ 2.下载源码 j ...

  4. Android 通知栏Notification的整合 全面学习 （一个DEMO让你完全了解它）

    在android的应用层中,涉及到很多应用框架,例如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架,通知机制,ActionBar框架等等. ...

  5. 如何在WTL和MFC中使用duilib及如何静态使用duilib库！（初级讲解 附带一个Demo）

    关于duilib的历史,我也就不多说了,能看到这篇文章的人都是有一定了解才能找到这个的. 我直接说下对这个库的基本使用吧. 我个人对一些好技术都是比较感兴趣的. 因为个人原因 喜欢接触一个好技术. 所 ...

  6. 白盒测试之gtest第一个demo

    认识gtest工具后,关于它的使用,下面将用一个demo程序演示一下gtest的用法以及成果展示. 一.需要测试的C++代码: #include "myfunction.h" // ...

  7. 在VS中实现webService的一个demo（图解）

    在VS中实现webService的一个demo(图解) 先创建一个web项目,创建好web项目后,添加新建项——web服务 在新建好的web服务文件中写如下代码: 生成当前解决方案. 新建一个winf ...

  8. Cocos2d-x 学习（1）—— 通过Cocos Studio创建第一个Demo

    近期在工作上有了比較大的转变,自学情绪也慢慢高涨,本来一直在研究unity的技术.由于换了工作会開始接触cocos2d-x.但并不意味着停止研究unity,以后有时间还是会继续的. 公司的cocos2 ...

  9. 使用android的mediaplayer做成 一个demo,欢迎测试使用

    附件是为一个定制视频产品而简单的写了一个demo,用来说明android的mediaplayer是如何使用的. http://files.cnblogs.com/guobaPlayer/palyerD ...

随机推荐

  1. CentOS 7下使用RPM安装mysql的方法。

    1.卸载系统自带的 mariadb-lib [root@centos-linux ~]# rpm -qa|grep mariadbmariadb-libs-5.5.44-2.el7.centos.x8 ...

  2. 『StabilityGuide』| 10+位阿里技术专家共同发起稳定性知识库开源项目

    我们穿过山和大海,也见过人山人海.我们见过各类故障,也排过千雷万险.这一次,不如我们一起,开启稳定性的探索之旅.让无法解决的问题少一点点,让世界的确定性多一点点. 无论是前端业务的开发者,还是后端架构 ...

  3. Django项目：CRM(客户关系管理系统)--01--01PerfectCRM基本配置ADMIN01

    一.CRM项目需求 二．CRM项目新建 PerfectCRM crm

  4. 官网svn提交到代码库，但是不能同步到web目录

    现象:数据库名字存在,但是数据库中表为空:svn提交代码能到svn库中,但不能同步到web目录. 原因:磁盘分区满了,导致内测服务器中数据库先删掉但没能从线上拉取回来,显示数据库中表为空: 磁盘满,导 ...

  5. JS---案例：开机动画

    案例:开机动画 由上下两部分组成,先下面的高变为0 ,再最大的div宽为0,形成一个缩小到没有的动画效果 点击的X是在背景图上的,在上面设置了一个空的span用于注册点击事件 <!DOCTYPE ...

  6. 【JZOJ5088】【GDOI2017第四轮模拟day2】最小边权和 排序+动态规划

    题面 有一张n个点m条边的有向图,每条边有一个互不相同的边权w,有q个询问,要求你从点a经过不超过c条边到点b,要求经过的边权递增并和尽量小,求出最小的边权和,如果没有合法方案则输出-1. 对于100 ...

  7. RabbitMQ的优劣势

    优势:支持集群化.高可用部署架构.消息高可靠支持 复杂系统的解耦: 复杂链路的异步调用 瞬时高峰的削峰处理. 这里提一下RocketMQ,是阿里开源的,经过阿里的生产环境的超高并发.高吞吐的考验.性能 ...

  8. 计算机网络 5.6-5.8 TCP/UDP

    来看看传输层的位置 要点: 传输层是为两个应用进程提供端到端的通信 传输层的复用和分用 传输层与应用层就是端口 (传输层的应用访问点 TSP) 传输层与网络层之间就是协议字段(网络层的 NTSP) 端 ...

  9. oralce默认语言

    默认语言设置可以确定数据库如何支持与区域设置相关的信息,例如: 日和月份的名称及其缩写 A.M..P.M..A.D. 和 B.C. 的等价表示方法的符号 指定 ORDER BY SQL 子句时字符数据 ...

  10. php中array_slice和array_splice函数解析方式方法

    array_slice array array_slice ( array $array , int $offset [, int $length = NULL [, bool $preserve_k ...