14avalon - 指令ms-controller (controller绑定)

简介: 14avalon - 指令ms-controller (controller绑定)

ms-contoller介绍

ms-contoller这个指令是用于圈定某个VM的作用域范围(换言之,这个元素的outerHTML会被扫描编译,所有ms-*及双花括号替换成vm中的内容),ms-controller的属性值只能是某个VM的$id

注意:

  1. ms-controller的元素节点下面的其他节点也可以使用ms-controller
  2. 每个VM的$id可以在页面上出现一次, 因此不要在ms-for内使用ms-controller.
  3. 当我们在某个指令上用@aaa时,它会先从其最近的ms-controller元素上找, 找不到再往其更上方的ms-controller元素

代码例子

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript" src="avalon/dist/avalon.js"></script>
    <script>
      avalon.define({
        $id: "AAA",
        name: "liger",
        color: "green"  
      });
      avalon.define({
        $id: "BBB",
        name: "sphinx",
        color: "red"  
      });  
      avalon.define({
        $id: "CCC",
        name: "dragon" 
      });
      avalon.define({
        $id: "DDD",
        name: "sirenia" //不存在color
      });
    </script>
  </head>
  <body>
    <div ms-controller="AAA">
      <div>{{@name}} : {{@color}}</div>
      <div ms-controller="BBB">
        <div>{{@name}} : {{@color}}</div>
        <div ms-controller="CCC">
          <div>{{@name}} : {{@color}}</div>
        </div>
        <div ms-important="DDD">
          <div>{{@name}} : {{@color}}</div>
        </div>
      </div>
    </div>
  </body>
</html>

运行结果:

目录
相关文章
19avalon - 指令ms-class(类名绑定)
19avalon - 指令ms-class(类名绑定)
61 0
33avalon - 指令ms-validate(验证绑定)
33avalon - 指令ms-validate(验证绑定)
50 0
|
JavaScript
24avalon - 指令ms-for(循环绑定)
24avalon - 指令ms-for(循环绑定)
46 0
|
JavaScript
31avalon - 指令ms-rules(验证规则绑定)
31avalon - 指令ms-rules(验证规则绑定)
49 0
|
4月前
|
弹性计算 Kubernetes 监控
Controller Manager工作原理
【7月更文挑战第3天】Controller Manager是Kubernetes核心组件,监控集群资源状态变化,维持期望状态。
|
11月前
|
XML 前端开发 JavaScript
SpringMVC中单独配置<mvc:default-servlet-handler/> 导致 Controller失效
SpringMVC中单独配置<mvc:default-servlet-handler/> 导致 Controller失效
271 0
|
JavaScript
22avalon - 指令ms-if(if绑定)
22avalon - 指令ms-if(if绑定)
45 0
35avalon - 指令ms-widget(组件绑定介绍)
35avalon - 指令ms-widget(组件绑定介绍)
31 0
Jmeter系列(36)- 详解 Loop Controller 循环控制器
Jmeter系列(36)- 详解 Loop Controller 循环控制器
273 0
Jmeter系列(36)- 详解 Loop Controller 循环控制器
|
XML Java 数据格式
web service axis2 参数为对象传递
web service axis2 参数为对象传递
118 0