Avalon
There are many filters in itself, such as date、number
text filters and loop filters; avalon
methods are also provided to customize filters according to needs.
Example:
(1) Define a myFunc
personalized filter and add it to the element;
(2) Use avalon
the filter defined by itself.
as follows:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Avalon demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="./avalon.js"></script>
<script type="text/javascript">
avalon.filters.myFunc = function () {
return '这是一个自定义的过滤器'
}
var vm = avalon.define({
// wrap 用作该 Model的载体
$id: "maincontainer", // 告诉avalon这个Model是作用于哪个ms-controller的
msg: "Hello,world!", // 定义一个avalon对象属性“msg”,其值是“Hello,world!”
time: 1482878745000
});
avalon.scan(); // 这句话可以加,也可以不加,因为avalon有自己的DOMReady模块,会自动扫描全文。
</script>
<style>
.ms-controller {
display: none;
}
</style>
</head>
<body>
<div>
<!-- 给div加上监听器 -->
<div ms-controller="maincontainer">
<p>{
{msg | myFunc}}</p>
<!-- 使用过滤器date,传入时间格式 -->
<p>{
{time|date('yyyy-MM-dd HH:mm:ss')}}</p>
</div>
</div>
</body>
</html>
Page effect: