avalon2
Version:
an elegant efficient express mvvm framework
50 lines (45 loc) • 1.64 kB
HTML
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="../../dist/avalon.js"></script>
<script>
avalon.filters.limit = function (str, a) {
return String(str).slice(0, a)
}
var vm = avalon.define({
$id: 'duplex1',
aaa: 123456,
bbb: '123a',
ccc: 'true',
ddd: true,
aa: [333],
select: [111, 444]
})
</script>
<!--
-->
</head>
<body>
<div ms-controller='duplex1'>
<p>使用了ms-duplex-number后只能输入number</p>
<input ms-duplex-string='@aaa|limit(4)'><span>{{@aaa}}</span>
<input ms-duplex-number='@bbb'><span>{{@bbb}}</span>
<input ms-duplex-boolean='@ccc' ><span>{{@ccc}}</span>
<input ms-duplex-checked='@ddd' type='radio'><span>{{@ddd}}</span>
<div>
<input ms-duplex-number='@aa' value='111' type='checkbox'>
<input ms-duplex-number='@aa' value='222' type='checkbox'>
<input ms-duplex-number='@aa' value='333' type='checkbox'>
</div>{{@aa}}
<select ms-duplex-number='@select' multiple="true">
<option>111</option>
<option>222</option>
<option>333</option>
<option>444</option>
</select>
</div>
</body>
</html>