Avalon 学习系列(五)—— 过滤器

Avalon 本身有很多过滤器,例如 date、number等文本过滤器、循环过滤器;avalon 也提供了方法可以根据需求自定义过滤器。

示例:

(1)定义一个 myFunc 的个性化过滤器,并加在元素上;

(2)使用 avalon 本身定义的过滤器。

如下:

DOCTYPE html>
<html>

<head lang="en">
  <meta charset="UTF-8">
  <title>Avalon demotitle>
  <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 ms-controller="maincontainer">
      <p>{{msg | myFunc}}p>
      
      <p>{{time|date('yyyy-MM-dd HH:mm:ss')}}p>
    div>
  div>
body>

html>

页面效果:
Avalon 学习系列(五)—— 过滤器_第1张图片

你可能感兴趣的:(#,Avalon,学习,java,python)