标签：
一、介绍
首先avalon是我接触的第一个mvvm框架，angularjs也能实现基本同样的功能，但是老外的产物都是比较先进的，他们早已放弃在IE下摸爬滚打，作为大天朝的我们，还是必须要矜矜业业的伺候着IE6，这就是我为什么选择avalon，没用angularjs的原因。官方文档都是老写法，这让我忍不住深深的吐槽正美，好吧，维护一个框架是艰难的，正美加油吧。
二、日历插件篇datepicker
官方文档的参数：
<!DOCTYPE HTML><html><head><meta charset=‘utf-8‘/><title>datepicker demo</title><script src=‘avalon.js‘></script></head><body><div class="demo-show" ms-controller="demo"><fieldset style="position: relative; z-index: 2"><legend>默认配置的单日历框</legend><input ms-widget="datepicker"/><p>说明：默认情况下，日历显示方式从周一到周日，显示一个月份，输输入域不允许为空，点击next、pre切换月份时，默认切换一个月，并且不可通过下拉框切换月份和年份</p></fieldset><fieldset style="position: relative; z-index: 1"><legend>默认配置的单日历框</legend><input ms-widget="datepicker" data-datepicker-allow-blank="true"/><p>说明：此demo配置allowBlank为true，使得输入域可以为空,与第一个demo做对比</p></fieldset><script>require(["datepicker/avalon.datepicker"], function(avalon) {var model = avalon.define("demo", function(vm) {})avalon.scan();})</script></div></body></html>
require(["引用的模块"],function(){//具体代码})
<script src=‘avalon.js‘></script>
require(["datepicker/avalon.datepicker"],function(){//在这里引用了avalon.datepicker模块})
require(["avalon","avalon.datepicker"],function(){//依赖了avalon.js和avalon.datepicker})
<input ms-widget="datepicker"/>
- //Basics.html
<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title></title></head><body><div ms-controller="datebat"><input ms-widget="datepicker"/></div></body><script src="bower_components/requirejs/require.js" data-main="Basicsmain.js" defer async="true"></script></html>
- //Basics.js
require([‘avalon‘,‘avalon-date‘],function(avalon){avalon.ready(function(){var datemodule = avalon.define({$id: ‘datebat‘});avalon.scan()})})
//Basicsmain.jsrequire.config({paths : {‘avalon‘ : ‘bower_components/avalon/min/avalon.min‘,‘avalon-date‘ : ‘bower_components/avalononiui/datepicker/avalon.datepicker‘}});require([‘app/Basics.js‘]);//require我不是很熟悉，希望大神不要吐槽，哈哈哈哈
标签：
原文地址：http://www.cnblogs.com/Zjingwen/p/4464148.html
